<!DOCTYPE html> <!-- You should see only one green box for letter 'A'. 'B' should be black. --> <html style="font-family: ahem; font-size: 50px; -webkit-font-smoothing: none;"> <style> div:first-letter { color: green; } .test:before { content: 'A'; } </style> <body> <div id="div1">BCD</div> <script> document.body.offsetTop; document.getElementById('div1').setAttribute('class', 'test'); </script> </body> </html> Right now, you will see 'A' and 'B' both green.
This issue is perhaps related to the FIXME mentioned in RenderBlock::updateFirstLetter(): // FIXME: We need to destroy the first-letter object if it is no longer the first child. Need to find // an efficient way to check for that situation though before implementing anything. Shall try and upload a patch for the same.
(In reply to Arpita Bahuguna from comment #1) > This issue is perhaps related to the FIXME mentioned in > RenderBlock::updateFirstLetter(): > // FIXME: We need to destroy the first-letter object if it is no longer > the first child. Need to find > // an efficient way to check for that situation though before > implementing anything. > > Shall try and upload a patch for the same. We still have this FIXME - https://searchfox.org/wubkat/source/Source/WebCore/rendering/RenderBlock.cpp#2668