Первый и последний ребенок с IE8

У меня есть некоторые CSS для корректировки вещей в моей таблице.

Вот:

.editor td:first-child
{
    width: 150px; 
}

.editor td:last-child input,
.editor td:last-child textarea
{
    width: 500px;
    padding: 3px 5px 5px 5px;
    border: 1px solid #CCC; 
}

Он работает с Firefox, Safari и Chrome, но не (в настоящее время) с IE8.

Я знаю, что проблема исходит от первого и последнего ребенка, но я не эксперт.

Любая идея, как я могу это исправить?

PS: я добавил <!doctype html> поверх моего HTML-документа, но ничего не изменилось.

Источник

3 ответа

Решение

Если ваша таблица имеет только 2 столбца, вы можете легко добраться до второго td с соседним селектором, который IE8 поддерживает вместе с :first-child:

.editor td:first-child
{
    width: 150px; 
}

.editor td:first-child + td input,
.editor td:first-child + td textarea
{
    width: 500px;
    padding: 3px 5px 5px 5px;
    border: 1px solid #CCC; 
}

В противном случае вам придется использовать библиотеку селектора JS, например, jQuery, или вручную добавить класс в последний td по предложению Джеймса Аллардика.

Источник

Поскольку :last-child псевдокласс CSS3, он не поддерживается в IE8. я верю :first-child поддерживается, как это определено в спецификации CSS2.1.

Одним из возможных решений является просто дать последнему дочернему элементу имя класса и стиль этого класса.

Еще бы использовать JavaScript. JQuery делает это особенно легко, так как обеспечивает :last-child псевдокласс, который должен работать в IE8. К сожалению, это может привести к вспышке нестандартного содержимого во время загрузки DOM.

Источник

Если вы хотите продолжать использовать селекторы CSS3, но должны поддерживать старые браузеры, я бы предложил использовать полифилл, такой как http://selectivizr.com/

Источник
Другие вопросы по тегам