Text-align: -webkit-center vs text-align: center

Question

Does anyone know why there is a difference between text-align: center and, text-align: -webkit-center? For example, if you have:

<section> <h1>Title<h1> <div class="image"></div> </section> 

// CSS with text-align: center;

 section{ text-align: center; } 

This will only center the text.

// CSS with text alignment: -webkit-center

 section{ text-align: -webkit-center; } 

This centers the text and image.

The same goes for text-align: -moz-center;

Answer 1

In the Mozilla Developer Network:

Both WebKit and Gecko support the prefix version of the left, center, and right, which applies not only to inline content, but also to block elements. This is used to implement deprecated align attributes on table and <center> elements. Do not use them on production websites.

- MDN documentation on text-align .

Answer 2

The text-aligned CSS property describes how inline content, such as text, is aligned in its parent block element. text-align does not control the alignment of block elements, but only their inline content.

 text-align: -moz-center; text-align: -webkit-center; 

Answer 3

This is the css prefix for the property used for certain browser engines,

eg,

-webkit for Chrome, Safari;

-moz for Firefox, -o for Opera

  -ms for Internet Explorer