I'm unable to give my buttons zero width?

[lucibat]

I basically just want to make it so that the button width slides open to reveal the text when one hovers over the pseudo element, but I can’t seem to get rid of the default width? as you can see the text is still somewhat visible prior to hover.

https://codepen.io/kitglitch/pen/PyMGPB

[stancevicbranko]

Hello,

First of all: you need to remove padding from button since overflow works for edge of the item not for edge of the padding (if that make sense :D).

For the dots: i wouldn’t make them absolute since you want them to be visible in default state. Let them to be in flow of the text. And since they are 9px wide, just set width of the buttons to be 9px. And on hover do what you did before.

Hint: if you want to animate that reveal, use max-width instead width and put transition on it and whola :)

Keep on hacking.

[lucibat]

thankyou for this. it worked

[Author]

Posts