In this post, I will share two solutions on how to resolve unwanted top spacing in your button elements. This issue usually happens when you have a newline or word break inside the button text value. The image below illustrates this.
Solutions
We can fix this issue by adding a vertical-align property into the CSS or enclosing the buttons inside a flex container.
Solution using vertical-align
Solution using flex container
Conclusion
I hope this simple guide helps you in dealing with button spacing issues. I recommend that you search the Internet for other possible solutions as well.
Originally published at https://johnpili.com on February 2, 2022.
