Помогите с версткой

12
D
На сайте с 20.09.2010
Offline
175
801

Подскажите пожалуйста как сверстать такой шаблон для резиновой верстки. Что-то никак не получается..

jpg yyyyyyy.jpg
[Удален]
#1


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Заголовок страницы</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
html{position: relative; top: 0; height: 100%;}
body{position: relative; top: 0; min-height: 100%;}
.clr{clear: both;}

.conteiner{margin: 0 260px 0 0; padding: 0 0 100px 0;}
.rightSitebar{width: 250px; float: right; padding: 0 0 100px 0;}
.leftSitebar{width: 200px; float: left;}
.content{margin: 0 0 0 210px;}

.footer{position: absolute; bottom: 0; left: 0; width: 100%;}
</style>
</head>
<body>
<div class="rightSitebar">
Правая колонка
</div>
<div class="conteiner">
<div class="header">
Шапка
</div>
<div class="leftSitebar">
Левая колонка
</div>
<div class="content">
Контент
</div>
</div>
<div class="clr"></div>
<div class="footer">
Подвал
</div>
</body>
</html>
D
На сайте с 20.09.2010
Offline
175
#2

Подскажите а можно сделать так чтобы блок content шел первым ? Тоесть

чтобы сначала было

<div class="content">

Контент

</div>

а потом все остальные блоки..

?

NW
На сайте с 08.12.2011
Offline
77
#3
datum:
Подскажите а можно сделать так чтобы блок content шел первым ? Тоесть
чтобы сначала было
<div class="content">
Контент
</div>
а потом все остальные блоки..
?

прописать div content в начале !

Анкета для новичков и профессионалов, вопросы могут быть разными!
D
На сайте с 20.09.2010
Offline
175
#4

это понятно, а стили какие должны тогда быть?

NW
На сайте с 08.12.2011
Offline
77
#5
datum:
это понятно, а стили какие должны тогда быть?

background-position:center top;

---------- Добавлено 07.11.2012 в 17:57 ----------

да и margin:0 auto;

---------- Добавлено 07.11.2012 в 17:58 ----------

а остальное уже по порядку !

D
На сайте с 20.09.2010
Offline
175
#6

а при чем здесь background-position ?

NW
На сайте с 08.12.2011
Offline
77
#7
datum:
а при чем здесь background-position ?

это я просто написал, можно без этого !

---------- Добавлено 07.11.2012 в 18:13 ----------

пример стиля !

#contener{width:1200px;margin:0 auto; }

#content{float:left; width:1000px;}

#menuleft{float:left; width:200px; padding-right:5px;}

#seredina{float:left; width:480px}

#menuright{float:right; width:200px; padding-left:5px;}

#podval{float:left; width:1000px;}

---------- Добавлено 07.11.2012 в 18:14 ----------

а высоту на выбор !

[Удален]
#8
niko-web:
это я просто написал, можно без этого !

Не нужно просто писать. Чушь пишите.

datum:
Подскажите а можно сделать так чтобы блок content шел первым ?

Там много подводных камней. Хотя можно что-то придумать.

AGRESSOR
На сайте с 04.07.2010
Offline
79
#9


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Заголовок страницы</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<style>
html,body{width:100%;height:100%;font:24px Arial;margin:0;padding:0;}
.clear{clear:both;}
#page{width:75%;float:left;}
#header{height:150px;background:#00f;}
#content{width:80%;float:right;}
#left-sidebar{width:20%;min-height:900px;float:left;background:#ff0;}
#right-sidebar{width:25%;min-height:1050px;float:left;background:#f00;}
#footer{width:100%;height:150px;background:#008000;}
</style>
</head>
<body>
<div id="page">
<div id="header">
HEADER
</div>
<div id="content">
CONTENT
</div>
<div id="left-sidebar">
LEFT SIDEBAR
</div>
</div>
<div id="right-sidebar">
RIGHT SIDEBAR
</div>
<div class="clear"></div>
<div id="footer">
FOOTER
</div>
</body>
</html>

Вот вариант, блок #content сверху и все остальное резиновое

По-удаляете min-height:900px; и min-height:1050px; потом

D
На сайте с 20.09.2010
Offline
175
#10

так ведь сначала идет болк хедер, а потом content

12

Авторизуйтесь или зарегистрируйтесь, чтобы оставить комментарий