IE, z-inex, position absolute и relative

smike

Новичок
IE, z-inex, position absolute и relative

PHP:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
	<title>Test</title>
	<style type="text/css">
		div.red{
			position:relative;
			width:100px;
			height:100px;
			background:red;
			margin-top:5px;
		}
		
		div.green{
			position:absolute;
			width:90px;
			height:90px;
			top:20px;
			left:20px;
			background:green;
			z-index:1;
		}
	</style>
</head>
<body>

	<div class="red">
		<div class="green"></div>
	</div>

	<div class="red">
		<div class="green"></div>
	</div>

	<div class="red">
		<div class="green"></div>
	</div>

</body>
</html>
Результат:
В ИЕ -

В ФФ -


Подскажите пожалуйста что нужно сделать чтоб в ИЕ было также как в ФФ?
 

Nicholas

Новичок
PHP:
<div class="red" style='z-index:3'> 
    <div class="green"></div> 
</div> 

<div class="red" style='z-index:2'> 
    <div class="green"></div> 
</div> 

<div class="red" style='z-index:1'> 
    <div class="green"></div> 
</div>
А вот почему такая фигня происходит, читайте в спецификации css ))
 

smike

Новичок
Я уже нашел этот ответ, но все равно спасибо. А фигня такая происходит скорее всего оттого, что некоторые разработчики браузеров забивают на спецификацию css )))
 

Nicholas

Новичок
Именно так..
только в конкретном слечае, забили на спецификацию именно FF и Opera

Цитата из спецификации:
У каждого блока в заданном позиционном контексте имеется целочисленный индекс позиционного уровня, который указывает его положение на оси z относительно других блоков этого же контекста.
Учись студент, читай мануалы!!!
 
Сверху