Re:Show HN: Neat, the Minimalist CSS Framework
by chrismorgan on Wednesday April 26, 2023 @10:08AM
(#35713881)
I think you’re misunderstanding what my invocation achieves: reduced line height on larger text.
Re:Show HN: Neat, the Minimalist CSS Framework
by moritz on Wednesday April 26, 2023 @03:17PM
(#35718625)
No, I am proposing you write
line-height: calc(2.5ex + 0.5rem);
instead. The effect is the same, but based on the x-height of the font used, which can be beneficial for the reasons outlined. Adjust the ex to taste, between 2 and 2.5 or so.
Re:Show HN: Neat, the Minimalist CSS Framework
by chrismorgan on Thursday April 27, 2023 @02:20AM
(#35723985)
Ah, sorry, I missed that.
Hmm, dunno. Interesting idea, but I suspect the uncertainty of actual value might cause me very mild difficulties occasionally. I’d want to play around with it in various fonts. Its failure mode is probably worse than using em, seen in a font with particularly tall ascenders or descenders. But then again, I have a vague feeling such fonts might commonly just extend beyond their box, in which case it’s not actually any worse.
In other news, I really want wide browser support for the lh unit.
Even cleaner imho, at least in theory, if you dont use 'em' but 'ex' for the relative sizing, the x-height of the element's first available font.
Good looking leading is often more influenced by the x-height of a typeface than by cap height (try setting Verdana and Times with the same line-height). So especially if your design has more than one typeface, using ex makes it more consistent.
Caveat: If the metrics are not set correctly in the font file, FF on Mac, and the Windows browsers will freak out. Should not be a problem with system fonts, but if you use web fonts, keep an eye on that.
I usually also set a unitless fallback, at least on the html element.