Is there any way to make font line-height default?
There’s many ways to control the line height without putting in too much work.
First, learn how to use the EM and REM units for font size.
em is relative to the font-size of its direct or nearest parent, rem is only relative to the html (root) font-size.
I suggest always using rem, it’s very convenient. By default most of the browsers have font-size on HTML set to 16px, so everything is relative to this. 1 remmeans then 16px. And you can adjust from there: H1 can be 2.2 rem, small text 0.75 rem, etc.
Once you got control over your font size, line height is a no brainer. For line height, the unit to use is… none. Yes, you can have what’s called unitless line height. By not using a unit, the value for line height means it’s a percentage of the font-size. in Webflow, select the unit shown as -, or just type it like this: 1.2-. So 1.2 line height on a 16px font size means “120% of 16”, or 18px.
So, the basic line height, that you’re going to use again and again, is likely 1.4or around that. I usuallygo from 1.2for very big text to 1.4for paragraphs.
You can start by setting your own HTML values by adding a custom code like this:
html {font-size:16px, line-height:1.4;}… and everything is going to inherit those values.
Take the time to properly style all titles and paragraph elements (as “All titles” and “All paragraphs” selected in the selector box) and you’ll have a lot less work down the road.
3 Likes