Skip to content
Sign upLog in
← Back to Community

How do I center an image in the middle of the screen?

Profile icon
kenzielixir

I'm working on a project and can't remember how to center an image...

Answered by InvisibleOne [earned 5 cycles]
View Answer
Voters
Profile icon
YueciaMikylla
Profile icon
kenzielixir
Comments
hotnewtop
Profile icon
InvisibleOne

In the css:

img { text-align: center; margin: auto; }

you can also try:

body { text-align: center; }

which will center everything on the page

Profile icon
Coder100

position absolute? idk
anyways your html is super messed up, replace it to:

<img src="img/8ball.png" alt="8Ball" height="210px" width="230px" id="magic8" />

css

#magic8 { position: absolute; top: calc(50% - 110px); left: calc(50% - 115px); }
Profile icon
kenzielixir

Oh wow my code was messed up...
Thanks for the help and corrections!