Example
Below are our styles according to the Styleguide.
Spacers are highlighted in blue
Green – title with line-height according to the Styleguide:
Line-height 1.1666 \ 56px
Title
After we revised it according to your comment.
To do this, we had to reduce the line-height: 0.8 Line-height \ 38.4px
If we follow this logic, then we have two problems
Title
- 1. Here’s how the two lines of text will look like
Title Title Title Title Title Title Title TitleTitle Title Title Title Title
There is an option to keep the styles and by calculating reduce the spacer so that the total padding is 120px.
Title
Example to compare
Title
Title
However, in this case there is a second problem:
We will have to calculate the height of the spacer for each unique text block with different spacers above and below it. Which will eventually lead to major layout issues across the entire site