Hello,
Build a Random Quote Machine
I trying to undersatnd why ther is a space under buttons.
https://codepen.io/ALL9000/pen/dyJXazG
How do I align my three buttons. There is always this space at the bottom. If I increase the size of the icon, it remains present. There is no padding there marging. When I hover in the console, I see an offset position between the “a” tag and the icon. However, since the icon component is inside the tag, it should be inside and take up all the space.
You have the font-size set to 1.5em on the two svgs, which is basically a height, so one way to handle this would be to set the same height on the button and div that wraps them and then use flexbox to align them.
I used the flexbox on the Div, but there is always the space at the bottom of the icons.
I set the same heigth for button element and icones and this still the same pb.
You can change my code in codePen if you want. I made the code with VScode then I copy/past it so don’t worry.
You are close! What happens if instead of using a font size on the svgs you use height instead? Perhaps set the height to 100%?
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.