Как известно некоторый браузер не поддерживает правила «>» в CSS, которое иногда бывает очень нужным, например при создании списка списков, когда первый уровень списка не имеет отступа, а второй и последующие имеют. Сегодня мне в голову пришло решение, которое я хочу представить на ваш суд:
Первое правило в данном случае будет аналогом
Надо понимать, что это не полноценная эмуляция «>», т.к если из CSS правил убрать
Честно говоря не уверен, изобрёл ли колесо, потому что сейчас смотрю и думаю, что всё это уж как-то слишком просто оказалось.
upd: mtonly подсказал, что «всё уже украдено до нас»: meyerweb.com/eric/thoughts/2005/05/31/universal-child-replacement
<style type="text/css">
.wrapper ul li {color: red; margin-left: 0;}
.wrapper * ul li {color: green; margin-left: 20px;}
</style>
<div class="wrapper">
<ul>
<li>red
<ul>
<li>green</li>
<li>green</li>
<li>green
<ul>
<li>also green</li>
</ul>
</li>
</ul>
</li>
</ul>
</div>
Первое правило в данном случае будет аналогом
.wrapper > ul > li
, что и требовалось. Надо понимать, что это не полноценная эмуляция «>», т.к если из CSS правил убрать
.wrapper
, то результат будет тот же самый и это может привести в заблуждение.Честно говоря не уверен, изобрёл ли колесо, потому что сейчас смотрю и думаю, что всё это уж как-то слишком просто оказалось.
upd: mtonly подсказал, что «всё уже украдено до нас»: meyerweb.com/eric/thoughts/2005/05/31/universal-child-replacement