OnMouseOver; how to centre icons in updated code

The button hid some problems from you, and is not allowed to contain things, as you now know.
You made a bad start with that button, and because of it you need to redo some of the previous work.

That’s the price we pay for ignoring good practices.

1 Like

You helped me with it.

More pain for me too.

The only issue is the play isn’t centered.

Do you know how to center an element?

I guess not.

The best info about doing that is at https://css-tricks.com/centering-css-complete-guide/#both-fixed

margin: 0 auto;

That only does horizontal. You need vertical too, right?

top: 50%;
bottom: 50%;
left: 50%;
right: 50%;

Does that work?

I don’t know where I would place it.

The .initial style declaration seems like the right place.

I want to use 1 method that will work on all these.

By 1 method, does that include putting just 1 class name on the icons?

huh, what do you mean?

What do yo mean when you say 1 method.

One method of doing it that will work best.

That’s at https://css-tricks.com/centering-css-complete-guide/#both-fixed

Show me a bunch of different ways and I’ll pick one I like the best.