How to centre an image in CSS

Centering text in CSS is relatively easy. All you do is add the “text-aling: center” property.

If you’ve ever tried this with anything that isn’t text you’ll have noticed that this approach doesn’t work.

Instead, display your class as a block, then set the margins to auto. You also need to specify a width so the rest flows around this fixed parameter:

.yourclass {
	margin-left:auto;
	margin-right:auto;
	width: 400px;
	display:block;
}

This approach works with everything that is not text such as images.

Thanks to Bert Bos for this tip!