1
HTML/CSSIntermediate#css#tailwind
HTML/CSSBeginner#css#layout-puzzle
How do you vertically center text inside a single-line button using CSS?
For a fixed-height single line of text, set line-height equal to the button's height, which centers text vertically without flexbox. For multi-line or icon+text buttons, flexbox with align-items: center is more robust.
Example
.btn { height: 40px; line-height: 40px; padding: 0 16px; }
/* flexbox alternative for icons+text */
.btn-icon { display: flex; align-items: center; height: 40px; }