Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS Gap between 2 lines in a header text Re: Gap between 2 lines in a header text

#121825
Alen
Participant

@Paulie_D what exactly are you trying to demonstrate with your CodePen?

h1 a {
display:block;
}

Would result in clickable link across full block on h1 a.

What happens if your design requires long H1 headline that links multiple words to multiple sources? You would be mixing and matching your code. Making styling really difficult. Although, this passes validation, I wouldn’t recommend using it. You would be limiting modularity of your code.

Keep your CSS simple. Set baseline style for all headings & links. If any specific headline needs altering, can inherit the base style, then you make any necessary changes by being more specific with your code.

so:

h1 {
/*code*/
}

then:

.post h1 {
/* diff. style /*
}

.sidebar h1 {
/* diff. style /*
}

Hope that helps,
-Alen