Как использовать резервные значения для свойства `display` в CSS?

Question

Я хочу использовать display: inline-table и display: table-cell, но он не работает на старых браузерах, таких как IE7, поэтому мне нужен резерв display: inline-block.

Согласно http://afshinm.name/css-fallback-properties-better-cross-browser-compatibility/, с color собственности, что можно использовать

.me { 
    color: #ccc; 
    color: rgba(0, 0, 0, 0.5); 
} 

Затем я попытался

#wrapper { 
    display: inline-block; 
    display: inline-table; 
} 

#wrapper > .child { 
    display: inline-block; 
    display: table-cell; 
} 

но IE7 пытается использовать display: inline-table, display: table-cell вместо display: inline-block, даже если они не» т работы.

Примечания

• Я не хочу использовать JS, ни другой таблицы стилей внутри условных комментариев, чтобы добиться того, что
• Я хочу, чтобы быть действительным CSS

Answer 1

Обеспечивая вы просто ищет резервное решение для IE7, это можно сделать.

Добавить новое правило, начинающееся с *:first-child+html и оно будет распознавать только IE7.

Так что в вашем случае добавить

*:first-child+html #wrapper { 
    display: inline-block; 
} 

*:first-child+html #wrapper > .child { 
    display: inline-block; 
} 

Почему *:first-child+html? Ну, это переводится как элемент html, который является следующим братом другого элемента, который является первым ребенком их общего родителя. Хотя возможно создание таких DOM в недействительных application/xhtml+xml -захваченных XHTML и через JavaScript, в обычном HTML правила HTML-анализатора означают, что просто никогда не бывает.

Но IE7 имеет ошибку, где он соответствует *:first-child против узла DOCTYPE, который, поскольку этот узел является предшествовавшим узлом узла узла html, применяется правило.

IE6 не поддерживает :first-child, IE8 и более поздние версии не соответствуют * против узла DOCTYPE.

Добавление *:first-child+html к тому же селектору имеет дополнительное преимущество для повышения специфичности селектора, поэтому оно всегда будет иметь приоритет в IE7.

Дополнительные правила полностью действительны CSS.

Вы можете увидеть его в действии на http://alohci.net/static/ie7cssfallback.htm