text-box-trim CSS property
No
TP
No
No
When you style text, you are never sure how much space vertical space it will
take. That’s because fonts reserve some extra whitespace on the top and
bottom of a glyph. Adding the space reserved for the line-height complicates
it even further.
text-box-trim is a CSS property that allows you to trim the extra space on the
top and bottom of the text.
text-box-trim trimming the text’s height
via
You can use it like this:
h1 {
text-box-trim: both;
text-box-edge: cap alphabetic;
}
The text-box-edge property allows one to specify which edges should be
trimmed. See the links below for a list of possible values.
You get this effect, making it easier to manage vertical space:
This new property will make it easier to align text in buttons or next to icons too.