Ширина 3-ей колонки

Yahoo! · October 5, 2008

Вот есть у меня главный слой. В нём 3 колонки, 2 заданной ширины, а 3-я что бы сама растянулась на оставшееся место, а как - подскажите.

Параметр height: 100% только переносит колонку на новую строку и растягивает во всю ширину главного слоя. height: auto растягивает колонку в зависимости от содержимого. А больше я незнаю чего бы применить.

rus · October 5, 2008

приведи код

Yahoo! · October 5, 2008

Ну вот:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>3 êîëîíêè</title>

<style type="text/css">
.body {margin: 0px; padding: 0px}
.glav {width: 1024px; margin: 0 auto}
.left_colon {width 350px; float: left; background: green}
.center_colon {width: 500px; float: left; margin-left: 15px; background: red}
.right_colon {width: 350px; margin-left: 15px; background: blue; float: left}
</style>

</head>
<body>

<div class="glav">

<div class="left_colon">Ëåâàÿ êîëîíêà</div>
<div class="center_colon">Öåíòðàëüíàÿ êîëîíêà</div>
<div class="right_colon">Ïðàâàÿ êîëîíêà</div>

</div>

</body>
</html>

И мне надо, чтобы правая колонка имела ширину не которую я ей задам строго, а она сама растягивалась до конца правого края главного слоя.

rus · October 5, 2008

Ну не знаю, универсального решения не нашел, да и особо не заморачивался:


<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>3 êîëîíêè</title>
<style type="text/css">
html, body {
margin: 0px;
padding: 0px;
width: 100%;
}
.glav {
	position:relative;
	width: 100%;
	margin: 0px;
    padding: 0px;
}
.left_colon {
	position:absolute;
	background: green;
	width: 20%;
}
.center_colon {
    position:absolute;
	left:22%;
	width: 30%;
	background: red
}
.right_colon {
	position:absolute;
	left:54%;
	width: 50%;
	background: blue;
}
</style>
</head>
<body>
<div class="glav">
  <div class="left_colon">Ëåâàÿ êîëîíêà</div>
  <div class="center_colon">Öåíòðàëüíàÿ êîëîíêà</div>
  <div class="right_colon">Ïðàâàÿ êîëîíêà</div>
</div>
</body>
</html>

Edited October 5, 2008 by rus

Sign In

Ширина 3-ей колонки

Question

Yahoo!

Link to comment

Share on other sites

3 answers to this question

Recommended Posts

rus

Link to comment

Share on other sites

Yahoo!

Link to comment

Share on other sites

rus

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information