Нумерованный список в IE

rash · February 15, 2009

Вот столкнулся недавно с такой ситуацией:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
  "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
	<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
	<title>Title</title>
	<style type="text/css" media="screen">
		li {
			position: absolute;
			}
		.pos1 {
			top: 50px;
			left: 70pxl
			}
		.pos2 {
			top: 80px;
			left: 110px;
			}
		.pos3 {
			top: 15px;
			left: 150px;
			}
		.pos4 {
			top: 120px;
			left: 30px;
			}
		.pos5 {
			top: 30px;
			left: 50px;
			}
	</style>
</head>
<body>
<ol>
	<li class="pos1">внутреннее</li>
	<li class="pos2">принципиально</li>
	<li class="pos3">механической</li>
	<li class="pos4">экваториальный</li>
	<li class="pos5">гироскопических</li>
</ol>
</body>
</html>

В такой ситуации в IE пропадают маркеры списка (проверено в IE6 и IE7). Исправить это более-менее красиво пока не удалось, хотелось бы узнать на будущее, что можно попытаться сделать в этой ситуации, чтобы нумерованный список остался нумерованным списком даже при абсолютном позиционировании элементов.

SelenIT · February 15, 2009

Насколько я в курсе, это тот случай, когда злополучный hasLayout оказывается источником проблем, а "лекарством" от них. Нормального решения я не встречал. Вроде что-то отдаленно похожее получилось при замене position: absolute на position:relative; line-height: 0...

Edited February 15, 2009 by SelenIT

rash · February 15, 2009

Да, это действительно помогло, спасибо.

Хотя понять причину того, почему это так работает, пока для меня сложновато :-)

Придется этот «костыль» просто запомнить...

SelenIT · February 15, 2009

Это работает "на честном слове" и, увы, только для однострочных элементов списка. Фокус в том, чтобы "нечаянно" не включить этот <censored> hasLayout для элементов списка. Т.е. нельзя использовать ни position:absolute, ни height/width... Обнуление высоты строки заставляет относительное позиционирование работать подобно абсолютному (отсчет, по крайней мере по вертикали, идет от одной точки), но многострочного текста с ним уже не получится...

rash · February 15, 2009

Понятно, в той ситуации, в которой я столкнулся с этим впервые, все равно был многострочный текст.

Видимо, решение с явным указанием номера на странице, наиболее надежно, хоть и наименее красиво.

Sign In

Нумерованный список в IE

Question

rash

Link to comment

Share on other sites

4 answers to this question

Recommended Posts

SelenIT

Link to comment

Share on other sites

rash

Link to comment

Share on other sites

SelenIT

Link to comment

Share on other sites

rash

Link to comment

Share on other sites

Join the conversation

Обсуждения

Forums

Important Information