CSS, заставляющий UL слишком сильно отступать в IE
У меня есть панель навигации вверху страницы. В FF и Chrome панель навигации отображается в порядке. Однако в IE8 (с совместимостью или без нее) UL кажется отступом с левой стороны, а не каждый li только весь li; несмотря на объявление
text-align:center; width:600px; margin:auto; padding-left:0;
Любые идеи, что может быть причиной этого?
Ответы
Ответ 1
margin-left:0px;
В Firefox UL по умолчанию остается по умолчанию, в IE он имеет левое поле.
Пример:
<html>
<head>
<style>
ul{
border:1px solid red;
margin:0px;
list-style:none;
padding:0px;
}
li{
border:1px solid green;
margin:0px;
}
</style>
</head>
<body>
<ul>
<li>this</li>
<li>that</li>
<li>these</li>
<li>those</li>
</ul>
</body>
</html>
Ответ 2
Я просто использовал ul {list-style-position: outside; }, чтобы исправить отступ в IE.
Ответ 3
Я думаю, что это должно быть:
ul { padding: 0; margin: 0 }
li { padding: 0; }
Ответ 4
Использование list-style-position:outside;
специально для IE6/IE7 работало для меня. Обратите внимание, что это может потребоваться только в том случае, если вы используете list-style-position:inside;
для других браузеров и просто скрываете поле/дополнение по умолчанию по умолчанию, установив их в 0. Работа с IE требует некоторой утонченности и большого количества CSS-браузера.