Непонятная вещь - HTML и CSS

Doem · 21.03.2011, 09:31

Уже мучаюсь дня четыре. Ставилась задача шаблон сделать с баром наверху и футером прижатым к низу. Центральная часть нахожится по центру и растягивается по высоте. Но у меня ничего не получается. Что я сделал не так? Помогите пожалуйста. Заранее спасибо! =)

Код HTML:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">

<head>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<title>Untitled 1</title>
<link rel="stylesheet" type="text/css" href="style.css" />
</head>

<body>

<div id="main">

	<div id="top">
 	</div>
 	
 	<div id="content">
 	</div>
 	
 	<div id="footer">
 	</div>


</div>

</body>

</html>

Код:

* {
	margin: 0;
	padding: 0;
	}

body, html {
	height: 100%;
}

body {
	background: silver;
}

#main {
	height: 100%;
	border: 1px solid black;
	
}

#top {
	border: 1px solid black;

	height: 25px;
	margin-bottom: 10px;
	
	}

#content {
	width: 900px;
	height: 100%;
	background: white;
	margin: auto;
	margin-bottom: 10px;
	
}

#footer {
	width: 900px;
	height: 25px;
	margin: auto;
	background: gray;
}

Doem · 21.03.2011, 09:34

Скачать можете =)http://narod.ru/disk/7997743001/mysite.rar.html

Doem · 21.03.2011, 09:46

И вообще как сделать чтобы top был поверх всех блоков, а content отступал не от него, а от верхи страницы и мог бы под top залазить?

Merovingian · 31.03.2011, 03:07

PHP код:


			
* {

    margin:0px;

    padding:0px;

    }



html 

{ 

    height:100%;

}

body

{

    min-height:100%;

    position:relative;

    color:#000;

    background:#fff;

}

* html body

{

    min-height:99%;

}



#main {

    width: 900px;

    margin: 0px auto;

}



#top {

    border: 1px solid black;

    height: 100px;

    }



#content {

    background: white;

    width: 900px;

}



#footer {

    position:absolute;

    bottom: 0px;

    background:#8F9EB1;

    height:40px;

}

31.03.2011, 03:07	#4
Merovingian Пользователь Регистрация: 25.06.2010 Сообщений: 30	PHP код: * { margin:0px; padding:0px; } html { height:100%; } body { min-height:100%; position:relative; color:#000; background:#fff; } * html body { min-height:99%; } #main { width: 900px; margin: 0px auto; } #top { border: 1px solid black; height: 100px; } #content { background: white; width: 900px; } #footer { position:absolute; bottom: 0px; background:#8F9EB1; height:40px; }

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Рассчитаем незамысловатую вещь)	Владимир_Мар	Общие вопросы Delphi	1	04.06.2010 18:31
Как сделать такую вещь?	Mr.Qwerty	Общие вопросы Delphi	9	01.08.2009 05:17
Непонятная вещь при входе в систему...	Kopy3	Помощь студентам	9	27.07.2009 20:41
Подскажите простую вещь, пример прилагается	redcarpet	HTML и CSS	9	29.01.2008 03:07
Объясните чайнику одну вещь	Riddick2013	Помощь студентам	1	03.01.2008 21:37

21.03.2011, 09:34	#2
Doem Новичок Джуниор Регистрация: 21.03.2011 Сообщений: 3	Скачать можете =)http://narod.ru/disk/7997743001/mysite.rar.html

21.03.2011, 09:46	#3
Doem Новичок Джуниор Регистрация: 21.03.2011 Сообщений: 3	И вообще как сделать чтобы top был поверх всех блоков, а content отступал не от него, а от верхи страницы и мог бы под top залазить?