Слои дополняющию 100% ширины

dima_mak · February 16, 2010

Подскажите как сверстать такую идею: 3 вертикальных блока, два крайних с заданной шириной, а третий должен дополнять до 100% ширины окна?

	<div id="menu">

	</div>
	<div id="text">

	</div>
	<div id="images">

	</div>

#menu{
	position:relative;
	padding-top:150px;
	padding-right:50px;
	text-align:right;
	float:right;
}

#text{
	position:relative;
	padding-right:20px;
	padding-left: 20px;
	text-align:right;
	width:auto;
	float:right;
}

#images{
	position:relative;
	width:200px;
	float:right;
}

слой text должен дополнять, но не авто, не 100% не помогают.

psywalker · February 16, 2010

Не понял задачу, покажи на скрине.

rus · February 16, 2010

Не понял задачу, покажи на скрине.

Что тут непонятного?

Два блока фиксированной ширины: один слева, другой справа.

Один блок резиновый, между ними: тянется и заполняет между ними все оставшееся пространство.

psywalker · February 16, 2010

Что тут непонятного?
Два блока фиксированной ширины: один слева, другой справа.
Один блок резиновый, между ними: тянется и заполняет между ними все оставшееся пространство.

Да в том то и дело, что удивился, неужели так всё просто.

<!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">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>3 Колонки</title>
<style type="text/css">
	*{ margin: 0; padding: 0;}
	body { min-width: 700px;}

	div.left,
	div.right { float: left; background: red; width: 300px;}
	div.right { float: right;}

	div.content { overflow: hidden; background: blue;}
</style>

<!--[if IE 6]>
<style type="text/css">

	body {width:expression(document.documentElement.clientWidth < 960 ? "960px" : "auto");}

	div.left { margin-right: -3px;}
	div.right {margin-left: -3px;}

	div.content {zoom: 1;}
</style>
<![endif]-->

</head>

<body>

	<div class="left">LEFT</div>

	<div class="right">RIGHT</div>
	<div class="content">CONTENTВы, как веб-разработчик, должны дорожить каждой минутой своего драгоценного времени, а не тратить его на «повторное изобретение колеса». Совсем необязательно из раза в раз создавать одни и те же макеты веб-страниц сайта, когда можно использовать готовые.

Готовые шаблоны хороши как раз тем, что для получения конечного результата достаточно внести в них незначительные корректировки и конечный продукт готов. При этом экономится уйма времени, которое, как известно, деньги!</div>


</body>
</html>

dima_mak · February 17, 2010

решил вот так -

http://www.softtime.ru/forum/read.php?id_f...;id_theme=71915

psywalker · February 17, 2010

Ну правильно, галимые способы намного лучше)

Sign In

Слои дополняющию 100% ширины

Question

dima_mak

Link to comment

Share on other sites

5 answers to this question

Recommended Posts

psywalker

Link to comment

Share on other sites

rus

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

dima_mak

Link to comment

Share on other sites

psywalker

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information