Image center | Sololearn: Learn to code for FREE!
New course! Every coder should learn Generative AI!
Try a free lesson

Image center

Hey. I wanted to ask who knows. Is it possible to place the image in the center (in CSS)? And if yes than how?

15th Jul 2019, 6:25 AM
Denis Alexandrovich Fandeev
Denis Alexandrovich Fandeev - avatar
4 Answers
+ 11
Coder Avoid <center> as it is a legacy tag and isn't a good practice to use any longer. Always apply design and layout specifications using CSS. Never use style HTML tags like <b>, <i>, <u>, <font>, <center>, etc for anything as these are from the days of past. 😉 In CSS, learn about what the others have suggested with setting the left and right margins to auto. That is going to be your friend. 😉 img { display: block; margin: 0 auto; } NOTE: The style rule above for margin is equivalent to the expanded version below: margin-top: 0; margin-right: auto; margin-bottom: 0; margin-left: auto;
17th Jul 2019, 11:45 AM
David Carroll
David Carroll - avatar
+ 4
use the image as backgound using background-image then set its background-position to center
15th Jul 2019, 6:48 AM
Taste - avatar
+ 4
CSS Pro Tips: Centering Elements by Domino
15th Jul 2019, 10:31 AM
Gordon - avatar
+ 3
Denis Alexandrovich Fandeev if you're referring to background image body { background: #fff url(img.jpg) center center / contain no-repeat; }
17th Jul 2019, 12:16 PM
Calviղ - avatar