I’m using a font called Dancing Script for my headlines and it’s working fine so long as it’s kept to one line. But on mobile devices it goes onto multiple lines and gets all bunched up.
This is H1, and I’m using inline CSS in a text box to achieve it because I don’t want the single pix line that comes under the Headline widget.
What CSS should I add to make the spacing between H1 lines normal (rather than bunched up)?
Thanks
Hi Tara
Sounds like you need to set the line-height for that H1.
h1.entry-title { line-height: normal; }normal can be changed to a px value.
Ref: http://www.w3schools.com/cssref/pr_dim_line-height.asp
It doesn’t seem to have worked Andrew.
If you look at this page (https://www.tarahanrahan.com/work-with-me/) the second H1 down still has that issue (after putting the CSS into the customize CSS section).
Thanks for the feedback. The CSS provided is only for the page’s first H1, the entry header. You can set line-height for any selector as follows:
h1 { line-height: normal; }That’s for any h1. Swap out h1 with whatever you want to set the line height of. The word normal can be replaced with a px value.
Perfect, thank you.
For sure, glad to hear that helped.