In the midst of my document, I find myself in need of extra space before a particular header, yet not before the initial header at the top of the page.
It seems like this scenario would be quite common, but unfortunately requires me to manually specify it.
To clarify, I desire something along these lines:
https://i.sstatic.net/oqlQo.png
However, upon specifying the margin-top as shown below:
h1 {
margin-top: 1.83em;
}
I am left with unsightly excess space at the page's top:
https://i.sstatic.net/bHQZs.png
I realize that I can resolve this by explicitly defining the top header. For example:
h1 {
margin-top: 1.83em;
}
h1:first-child {
margin-top: 0.66em;
}
Yet, I am curious if there are other methods available and what potential tradeoffs they may entail. While I could assign a class or an id to the initial header and update the CSS accordingly, I assume this is a commonly encountered issue and thus seek alternative solutions.