I'm looking to create a screen-wide headline with a simple text-logo. The challenge is to make it touch the container's top and bottom borders like this example, including its half-height variations.
Upon inspecting the HTML, I noticed that there was some built-in top and bottom margin for fonts that prevented the text from touching the container borders. To address this, I utilized the line-height
property (after guessing the proper value).
You can see my solution here: https://jsfiddle.net/2ukfc8e7/8/
Is there a more effective solution available?