It's a good start. As a usability rule of thumb, hovering something should never cause layout shift. In your case, when you hover the "Hover us please" text, it causes the width to change which in turn causes layout shift.
I've quickly updated your Codepen with a couple of changes to help show you how to center your box and use widths to avoid layout shift.
It's a good start. As a usability rule of thumb, hovering something should never cause layout shift. In your case, when you hover the "Hover us please" text, it causes the width to change which in turn causes layout shift.
I've quickly updated your Codepen with a couple of changes to help show you how to center your box and use widths to avoid layout shift.
codepen.io/getreworked/pen/BaQxpBW
I've Worked on that too, I'll update the codepen now
I also Made it in a way that the background color changes as you click on the icons :)