Random Quote Generator CSS Help

1

I’m having trouble getting the character image and button to stay put instead of shifting around.

When the quote or character images are rendered each time, the elements are all shifted around. I’d like it so that each element stays put. For example, if I wanted to repeatedly click the new quote button, it wouldn’t move around.

My codes a bit of a mess currently, apologies in advance.

My project so far: https://codepen.io/DebWeseigner/pen/pogOxEW?editors=0111

2

Hey. Try to define the number of columns of your grid and the size of each using grid-template-columns(n, size);. Then center your image by giving it place-self: center;.