Резиновая дивная

[rafic]

Задача состоит в том, что нужно создать дивную, резиновую верстку, в которой я не силен.

есть хеадер, средняя часть и фоотер.

хеадер высотой 300px
средняя часть 100%
фоотер 200px
Ну и по ширине и высоте 100% все выходит. Отступы всего сайта с лева и с права составляет 26px. В общем все смотрите в приложении. Подскажите как это осуществить?

 

[капрал]

с шириной проблем не будет. просто проставь всем елементам ширину. а для проставления 100% высоты дивов используй javascript.

если возникают трудности с проставлением 100% ширины и 26px полей, то используй враперы:

<div class="wrapper01">
<div id="top">
</div>
</div>
<style>
.wrapper01 {padding:0 26px;}
</style>

 

[farm]

проставления 100% высоты дивов используй javascript.

А вот и необязательно
Юзай сервис, только отступ 26px свой впишеш для каждого слоя.

Для просмотра скрытого содержимого вы должны войти или зарегистрироваться.

 

[t3s]

в хедере и футере просто используй width: 100%
а по средней части есть 2 варианта

1. делаешь у меню (ведь слева колонка меню, я верно понял?) width: 20% а у контента width: 80%

2. делаешь у меню жесткую ширину в пикселях, например width: 200px а у контента указываешь ширину 100% но обязательно укажи отступ слева 210px

 

[rafic]

В общем постарался следовать советам, но у меня все равно много чего не получается.

<div class="block">
	<div class="header">Header</div>
	<div class="center">
		<div class="menu">Menu</div>
		<div class="content">Content</div>
		<i class="clear"></i>
	</div>
	<div class="footer">Footer</div>
</div>

.clear{clear:both; height:0; display:block; overflow:hidden;}
.block{
	margin:0 26px 0 26px;
}
.header{
	background:#ff0000;
	height:224px;
	width:100%;
}
.center{
	margin:26px 0 26px 0;
}
	.menu{
		background:#aa0000;
		width:222px;
	}
	.content{
		background:#aa0000;
		width:100%;
		margin-left:232px;
}
.footer{
	background:#abcd00;
	height:72px;
	width:100%;
}

 

[t3s]

для menu добавь

.menu {
float:left
}

а width:100%; убери, поскольку ты указал отступы для общего контейнера .block

 

[Shpek]

для фуутера тоже
.footer {
float:left
}
а то он с wrappera вылетать будет (у меня постоянна такое)

и

.block {
width:100%;
heght:100%;
}