Tribute Page Help Pls

Hi,

I can’t get the image in my tribute page to be centered AND responsive at the same time.
The error message told me I should set display: block; but then my image is no longer centered.
Originally I wanted to use CSS grid to make the whole page responsive but when I set up the grid nothing changes.
So yeah help would be appreciated because I’m close to going mad here. :pleading_face:

Hi!
You can add margin: auto; to img tag… to center image, but for more, read this article: How to Center Anything with CSS - Align a Div, Text, and More
Good luck!

1 Like

Thank you that fixed my problem! I still can’t figure out why my grid won’t work but maybe it will just magically work when I start from scratch for the next challenge. :smiley:

You should add display: grid or flex where you need… usually for container.

Yeah I did that, I also set up all the other parameters for the grid to no avail.
Out of frustration I deleted it out of the code. :grimacing:
Though I think I might have made a pretty obvious error, I applied the grid to the body.
But I guess I have to define a wrapper and set the grid for that?

Yes you can.
Before that, learn more about grid.
CSS Grid Course - YouTube …it was very helpful for me + https://cssgridgarden.com/ also good

My tribute-page is here https://codepen.io/Vanachima/pen/wvGNaPJ
You can also find more examples of Tribute Pages on https://codepen.io/search/pens?q=tribute+page | for inspiration :slight_smile:

Damn that’s an impressive site! :+1:
Thanks for the help and those resources, I’ll get stuck right in.

1 Like