- From: Meteor0id via GitHub <sysbot+gh@w3.org>
- Date: Fri, 27 Jul 2018 21:51:01 +0000
- To: public-css-archive@w3.org
Meteor0id has just created a new issue for https://github.com/w3c/csswg-drafts: == [css-pseudo-4] property line-height should apply to ::first-letter == https://www.w3.org/TR/css-pseudo-4/#selectordef-first-letter If I read the spec correctly, It sias that all font-properties should aplly to this pseudo element, and I belive line-height is among them. For some readon in this example I have to multiply the font-size and add some padding to get a properly sized and aligned first letter. ``` <section class="article_introduction"> <p> Lorum Ipsum I dont know the rest out of my head and typing this is faster than looking it up and copying it over. Don't judge. </p> <p> Another paragraph for the sake of making sure nothing odd is happeing when someone changes the selector. </p> </section> ``` ``` section { max-width: 200px; } p { line-height: 1.6em; } .article_introduction p:first-of-type::first-letter { /* We are doing much more here than could be achieved by the upcoming property initial-letter. For example: we are also changing the font-family and applying a linear-gradient color. Therefore using ::first-letter will still be the way to go when initial-letter becomes a widely supported property in the nearby future. */ /* Setting the font-size, line height and padding is not clear to me */ font-size: 3.2em !important; /* 2em * 1.6 line-height = 3.2em */ padding: .2em 0 0 0; /*not sure why that .2em is needed*/ /* line height seems to have no effect on this floating pseudo element */ float: left; font-weight: normal; background: linear-gradient(to top left, #1a23e8, #10c0d0); /*#465298;*/ /*#00C8FF;*/ -webkit-background-clip: text; background-clip: text; color: transparent; /* because we want the color of the background to be visible!*/ } ``` Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/2959 using your GitHub account
Received on Friday, 27 July 2018 21:51:06 UTC