float и height 100%

freeek · January 10, 2011

надо сделать высоту ".left" равной высоте ".right" иначе говоря чтоб у него был рабочий height: 100%. всё чего мне удавалось добиваться это получения высоты видимой области и то не во всех браузерах (требуется ie6+ и нормальные)

<!DOCTYPE html>
<html>
	<head>
	<style type="text/css">
		.content {border: 1px solid red;}
		.left {width: 200px; float: left; border: 1px solid green;}
		.right {float: left; border: 1px solid black;}
		.clear {clear: both;}
	</style>
	</head>
	<body style="margin: 0; padding: 0;">
		top
		<div class="content">
			<div class="left">
				left content
			</div>
			<div class="right">
				right content
			</div>
			<div class="clear"></div>
		</div>
		bottom
	</body>
</html>

Edited January 10, 2011 by freeek

Протуберанец · January 10, 2011

На самом деле применение слоев для создания одинаковых по высоте колонок неверно по своей сути, поскольку противоречит идеологии слоев. А именно: высота слоя ограничена его содержимым и формируется автоматически.
...
Таким образом, видно четкое разделение подходов к верстке:
если используются слои, то колонки должны иметь высоту, которая определяется содержимым слоя;
колонки одинаковой высоты строятся с помощью таблицы.

http://htmlbook.ru/content/kolonki-odinakovoy-vysoty

Sign In

float и height 100%

Question

freeek

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

Протуберанец

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information