Веб-сайт, над которым я сейчас работаю, имеет несколько проблем с браузерами Webkit (Chrome, Safari и т. д.). Одна из этих проблем заключается в том, что у меня есть маркированный список, который отображается странно. Верхний элемент маркера идет справа от списка, а не слева.
(источник: jamespwright.com)
Кажется, я не могу это исправить. Я пробовал overflow:hidden, я пробовал list-style-position:inside, похоже, ничего не работает.
ИЗМЕНИТЬ
Я постараюсь предоставить часть кода, но это довольно большой сайт, созданный с помощью DotNetNuke, поэтому я не смогу дать вам слишком много информации.
Код, о котором идет речь, таков:
#PremiumServicesMenu .LinkList ul {
margin-top: 0px;
margin-left: 1em;
_margin-left: 3em;
margin-bottom: 0px;
}
/* Safari and Chrome specific settings */
@media screen and (-webkit-min-device-pixel-ratio:0)
{
.PremiumServicesContainer .LinkList ul {
list-style-position: inside;
}
}
и html для этого раздела таков:
<div id="PremiumServicesMenu">
<div class="PremiumServicesContainer">
<span class="Corporate">
<div id="PremiumServicesHeader">
<div class="PremiumServicesShim"></div>
<div class="PremiumServicesTitle">Premium Services</div>
<div class="EndCap"></div>
</div>
<div class="LinkList">
<ul>
<li><a href="#">AIMS</a></li>
<li><a href="#">Feed Lab Analysis</a></li>
<li><a href="#">MSDS</a></li>
<li><a href="#">Prior Cargo</a></li>
</ul>
</div>
</span>
</div>
</div>
Проблема, кажется, с высотой страницы. В других браузерах, если страница не очень высокая, этот раздел «Премиум-сервисы» по-прежнему сохраняет высоту, подходящую для всего, но в Webkit, если страница короткая, этот раздел укорачивается и помещает первый элемент рядом с изображением заголовка «Премиум-сервисы». чем на строке ниже. Если страница достаточно длинная, то эта проблема не возникает.
