P.class: the first line does not work

Question

I am trying to use the pseudo-selector of the first line, but it does not seem to work, and I cannot understand why. I tried using :: first-line, but to no avail. (Note: this has nothing to do with the boundary radius).

p.intro:first-line { text-transform: uppercase; } 

 <p class="intro">Instead of attempting to cover the full range of <abbr title="Cascading Style Sheets">CSS</abbr> selectors, I think it makes sense to begin with a subset of the most widely supported. The <a href="http://www.quirksmode.org/css/contents.html">compatibility charts compiled by Peter-Paul Koch</a> provide detailed support information.</p> 

Answer 1

I see this problem only in Chrome. Apparently there is an error that has not yet been fixed: https://code.google.com/p/chromium/issues/detail?id=129669

There is a workaround in this SO post that says you can use https://github.com/octopi/Linify to get the effect using the jquery plugin. Essentially, use linify to select the first line, and then apply the text-transform: uppercase property to the first line.