Need help fixing a glitch with my button
I'm not sure how why its doing what it's doing but whenever I hover and then hover off the btn it does this glitch where it sort of spazzes the background color. Would appreciate some help with this and any other feedback as well!!
8 Replies
.btn::before {background: red; top: 0; left: 0; }
.btn::after {background: green; bootm: 0; right: 0; }
https://codepen.io/Ghloo/pen/wvOVJqywoaah ty
do you know why adding that fixes it tho @majkl1288
your giving it a position on the main selector, not on the hover state which applies only on hover. so when the user is no longer hovering, those values are no longer applied. and it goes back to the defaults.
Yep, it was screwed. 😄 Sometimes it is easier to figure out what is desired and offer own approach. I knew what was wrong - wong combination of positioning, non-defined width or something such - but forgot since, sorry.
The positioning was on the hover state but no top/bottom/left/right/inset on main selector so both were still at the default of auto. Luckily a pretty straightforward fix!
Ah, I see now - I know I saw the top, left... stuff there and then not, did not realize it was on the hover state only. Pen css is pesky to see in the entirety.