P:first Child Doesn't Work If A Img Tag Is Immediately After The P Tag?

Hy there, can't make it to work i have something like this .body-post p:first-child:first-letter { font-size:240%; } and here the html:

Copy

//Side note, try to avoid using inline styles when possible. It can interfere with JS and media queries/

Solution 2:

After a bit of research I found out that first-letter can only be used on block elements (which you were doing).

In this solution I increased the selectivity of the text by wrapping it in a span and put in the proper styling to make the span an inline-block

http://jsfiddle.net/52Vjm/1/

<div><p><imgsrc="http://placekitten.com/100/100"/><span>Kittens are great</span></p></div>

span:first-letter { font-size:2em; }
span { display:inline-block; }
img { margin-right:5px; }

Share