'<small> tag destroys vertical alignment
I have set up vertical alignment using the same value line-height, vertical margins and paddings, but when there is a smaller element, like the <small> tag, inside the flow, it ruins for some pixels the vertical rhythm, I can solve adding vertical-align:top/bottom but the element is not aligned with the other text, U can add display:inline-block and transform:translateY(1px) to solve the other issue but this is not an elegant solution. Is there some other solutions? And I'm wondering why smaller texts work like that.
I linked a photo to make more clear.
Solution 1:[1]
If you want your lines of text to always have the same height, so they match your background, use line-height property.
Sources
This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.
Source: Stack Overflow
| Solution | Source |
|---|---|
| Solution 1 | tao |