Mutliple CSS псевдо-селекторы в Firefox не работают

Question

Конкретно это:

p:first-child:first-letter {font-size:48px;}

Работает во всех браузерах (даже в IE8 для громкого крика), но не в Firefox (v.10.02)

Кто-нибудь знает обходной путь CSS или javascript? Единственное, что я могу придумать, чтобы добиться того, чего я хочу (буквица в первом абзаце), это динамически обернуть этот первый символ тегами span. Но наверняка есть лучший способ?

Answer 1

вы могли бы сделать:

p:first-letter {font-size:48px;}
p + p:first-letter {font-size:1rem}

, который использует новый блок rem, который является root em, для IE> 8 вам придется вручную ввести размер корневого шрифта.

или вы можете использовать JQuery как

   $('p:first-child').addClass('first-child');

и измените свой CSS на

p.first-child:first-letter { font-size:48px}

Answer 2

Я думаю, что у р нет детей. попробуйте с:

p:first-letter{font-size:48px;}