IE6 и трехколоночный резиновый дизайн.

xonix · March 27, 2009

решено. тему можно удалять.

Edited May 4, 2009 by xonix

Great Rash · March 27, 2009

У меня нет ИЕ6...

Вот такая штука работает?

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
		"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">

<head>
	<title>template</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<style type="text/css">
		* {
			margin: 0;
			padding: 0;
		}

		.first,
		.second,
		.third {
			float: left;
			position: absolute;
			top: 0;
			bottom: 0;
		}

		.first {
			background: #f0f0f0;
			width: 25%;
			left: 0;
		}

		.second {
			background: #cecece;
			left: 25%;
			right: 25%;
			border-left: #000 1px solid;
			border-right: #000 1px solid;
		}

		.third {
			background: #f0f0f0;
			width: 25%;
			right: 0;
		}
	</style>
</head>

<body>

<div class="first">

</div>

<div class="second">

</div>

<div class="third">

</div>

</body>
</html>

xonix · March 27, 2009

У меня нет ИЕ6...
Вот такая штука работает?

Да. См. приложенный скриншот:

Правда в седьмом эксплорере несколько странновато:

Моя страница выглядит так:

Edited March 27, 2009 by xonix

Great Rash · March 28, 2009

Ну раз предложенный мной код работает в шестерке то адаптируйте его под свои нужды.

bottom: 0; вообще не нужен, это я для наглядности сделал.

Делаете шапку сайта (допустим 150px высотой), потом вписывайте мой код, у всех трех контейнеров (first, second и third) ставите top: 150px (по высоте шапки). Если планируется подвал, то придется немного переделать, а именно взять все три контейнера в общий к которому уже лепить подвал.

Sign In

IE6 и трехколоночный резиновый дизайн.

Question

xonix

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

Great Rash

Link to comment

Share on other sites

xonix

Link to comment

Share on other sites

Great Rash

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information