IE и абсолютное позиционирование по нижнему краю

smoke1 · November 21, 2007

нужно выровнять элемент относительно нижнего края блока с нефиксированной высотой

с FF проблем нет, а IE не выравнивает пока высота явна не задана.

пример http://demo.oceanit.ru/karfm/index123.html

У слоя 1 высота задана 60px, а у 2 и 3 определяется содержимым.

Соответственно элемент "100" в IE выравнивается правильно, а "200" и "300" нет.

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<style type="text/css" media="screen"><!--
#main {width:200px; background-color:#e0e0e0; padding:50px;}

#box {height:200px; border: 1px solid white;}

#box div {position:relative; border: 1px solid black;}

.left {position:absolute; left: -30px;}
.right {position:absolute; right: -30px; bottom: 0;}

--></style>

</head>
<body>

<div id="main">
 <div id="box">

 <div id="1" style="height: 60px;">
 <span class="left">1</span>
 <span class="right">100</span>
 <span>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</span>
 </div>
 <div id="2">
 <span class="left">2</span>
 <span class="right">200</span>
 <span>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</span>
 </div>
 <div id="3">
 <span class="left">3</span>
 <span class="right">300</span>
 <span>Lorem ipsum dolor sit amet, consectetuer adipiscing elit</span>
 </div>

 </div>
</div>
</body>
</html>

Есть ли пути решения этой проблемы?

smoke1 · November 21, 2007

Вопрос снимается. Помогло указание ширины для слоев 1, 2, 3 как 100%.

http://demo.oceanit.ru/karfm/index1234.html

Sign In

IE и абсолютное позиционирование по нижнему краю

Question

smoke1

Link to comment

Share on other sites

1 answer to this question

Recommended Posts

smoke1

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information