Опустить див вниз с флоатом - HTML и CSS - Страница 2

cooperOk · 20.01.2010, 15:47

может такой вариант пойдет :

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
.div1{
	background:#565656;
	border:1px solid #FF2000;
	width:500px;
	min-height: 100px;
	padding:20px 10px 0 10px;
	position: relative;
	display: inline-block;
}
.div2{
	float: left;
	width:50%;
	border: 1px solid #f00;
}
.div3{
	float:right;
	width:20%;
	border: 1px solid #0f0;
	position: absolute;
	bottom: 0;
	right: 0;
}
</style>
<title>TEST</title>
</head>
<body style="background:#333333; padding: 10px;">


<div class="div1">
<div class="div2">
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
</div>
<div class="div3">Левая Сторона</div>
</div>
</center>
</body>
</html>

rewiaca · 22.01.2010, 12:04

Цитата:

Сообщение от cooperOk

может такой вариант пойдет :

Код:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<style>
.div1{
	background:#565656;
	border:1px solid #FF2000;
	width:500px;
	min-height: 100px;
	padding:20px 10px 0 10px;
	position: relative;
	display: inline-block;
}
.div2{
	float: left;
	width:50%;
	border: 1px solid #f00;
}
.div3{
	float:right;
	width:20%;
	border: 1px solid #0f0;
	position: absolute;
	bottom: 0;
	right: 0;
}
</style>
<title>TEST</title>
</head>
<body style="background:#333333; padding: 10px;">


<div class="div1">
<div class="div2">
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
текст<br />
</div>
<div class="div3">Левая Сторона</div>
</div>
</center>
</body>
</html>

ДА! Это решение на 100% верно. Я так понял весь фокус в том что маленький блок с абсолютным позиционирование находится внутри большого блока с релятивным позиционированием? Насколько это кросс-бразуерно?

cooperOk · 22.01.2010, 13:09

Ну я проверял в Opere 10, Mozile 3.5, IE 8, Google Chrome 3... В последних вобщем все нормально. На счет IE6 сказать ничего не могу, не проверял

Похожие темы
Тема	Автор	Раздел	Ответов	Последнее сообщение
Richedit ScrollBar вниз	KoBRaAndrey	Общие вопросы Delphi	4	03.01.2010 20:10
При старте страницы, опустить полосу прокрутку вниз	_PROGRAMM_	JavaScript, Ajax	0	27.12.2009 18:45
RichEdit опускание вниз	KoBRaAndrey	Общие вопросы Delphi	8	04.12.2009 23:43
как растянуть див на всю высоту клиентской части окна браузера	Anopsa - Anna	HTML и CSS	3	21.09.2009 10:07
Див - Текст отьежает при клике (HTML)	kaviga	Помощь студентам	13	21.02.2009 11:57

22.01.2010, 13:09	#13
cooperOk Пользователь Регистрация: 11.11.2009 Сообщений: 66	Ну я проверял в Opere 10, Mozile 3.5, IE 8, Google Chrome 3... В последних вобщем все нормально. На счет IE6 сказать ничего не могу, не проверял