问题
Recently I have been playing around with the anchor tags' css of the page http://nate.fm/articles/ If you assign border around the link Light
or Pro-Life vs Pro-Birth
and change their font-weight
to more than 500
then suddenly the vertical alignment changes from middle to top. Below I have added images showing this:
Font Weight 700:
Font Weight 500:
More to the surprise, this bug disappears for any other font family than Crimson Text. I tried to replicate the bug on local but failed.
Could anyone shed some light over this bug?
回答1:
Since you mentioned it only happens with Crimson Text, it's probably just the way that font renders when bold. A similar question was asked here: Bold text line-height is higher than normal text line-height
I played around with disabling all the other styles on the page, to see if maybe something was overriding it, but couldn't find any culprits.
A possible work around might just be adding some padding-top.
来源:https://stackoverflow.com/questions/40124379/why-is-vertical-alignment-afftected-by-font-weight-with-crimson-text-font