In this example we will explore the different ways to center elements on the screen.

This paragraph is being centered by using a set width and margin:0 auto. The 0, for top and bottom margin, can be changed as needed.

Just some text

This image cannot be centered the same way as the paragraph and thus margin:0 auto doesn't work because the image is an inline element.

Here we are trying to center the paragraph using text-align:center on the parent. It isn't working because the parent is a block element.

Just some text

The img is being centered when the parent has text-align:center because the img is an inline element.

Here we set the paragraph to an inline element and now the text-align:center works.

Just some text

Here we set the img to a display:block element and so margin:0 auto works.