Not sure if this happen with me only
1 Like
It’s caused by the block height being 40px
while the text height of the button is 27px
and the padding height is 11px
which makes 38px
for the content height (2px
less than what the block height is set to). What that means is the content height is shorter than the block height and the content isn’t centered so the content just stays at the top while the button height extends further.
Here’s the dimensions in Chrome DevTools:
The weird thing is that the top padding is 5px
while the bottom padding is 6px so even if we took 2px from the 40px
, the content would still be 1px
higher than the center.
Probably either an oversight, compatibility/responsive issue, or feature.