Стиль CSS не распознается в IE9
Это сводит меня с ума. Вот некоторые HTML и CSS, которые у меня есть на образце страницы. Первым намерением было иметь LI без каких-либо маркеров. Я перепробовал все, что мог, но элементы списка будут отображаться со стандартным десятичным маркером. Я использовал инструмент разработчика, который поставляется с IE9 для проверки элементов UL и LI. Похоже, что IE вообще не распознает класс css "RecentAnnouncementsList". Эти элементы не показывают стиль, примененный к нему. Вся эта настройка отлично работает на Chrome. Что мне не хватает?
Спасибо
ul.recentAnnouncementsList
{
margin-left: 0px;
padding-left: 5px;
}
ul.recentAnnouncementsList li
{
margin-left: 0px;
padding-bottom: 5px;
list-style-type:none;
}
ul.recentAnnouncementsList li a{
color:#675DF0;text-decoration:none; font-size:0.85em;
}
ul.recentAnnouncementsList li span{
display: block;
text-indent: 0px;
text-transform: none;
}
<td>
<div>
<ul class="recentAnnouncementsList" id="recentAnnouncements">
<li><a href="#">Released 1</a></li>
<li><a href="#">Release 2</a></li>
</ul>
</div>
</td>
3 ответа
Наконец-то я решил эту проблему. Проблема заключалась в том, что я добавил новый CSS-класс с именем "контейнер" в файл. Я не уверен, что это какая-то ошибка в IE и FF, но CSS-файл был обрезан в начале этого стиля. Я узнал об этом, посмотрев в инструменты разработчика для IE. Когда я посмотрел на загруженный файл в IE, он не был завершен. Все мои стили, связанные с моими тегами UL/LI, присутствовали после определения этого класса. После того как я удалил класс "контейнер" из файла, все вернулось к норме.
Спасибо за ваш вклад и предложения.
Для моего проекта я однажды отрисовал IE9 как IE8, отобразив его с метатегом html
<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE8"/>
так что один и тот же CSS работал для обоих
IE 6-9 имеют ограничение на количество селекторов, объявленных в файле CSS. Я предполагаю, что стили, объявленные для.recentAnnouncementsList, расположены выше предела и полностью игнорируются. Существуют инструменты, ресурсы, которые помогают разбить большие CSS-файлы на несколько частей и сохранить количество селекторов в одном файле ниже предела:
- blesscss - инструмент командной строки
- css_splitter - для приложений Rails
- gulp-bless - для проектов NodeJS