html - How do you add multile vendor prefixes to one css property? -

I have an image inside the .img-container. I would like the image inside the container at the center.

  & lt; Div class = 'col-xs-12 col-sm-4 col-lg-4 img-container' & gt; & Lt; Img class = "img- about responsive img-" src = 'img / about5001000.jpg' & gt; & Lt; / Div & gt;  

The only way I know how to handle different browsers with CSS code is how to code them individually (-moz-center, webkit-center):

  .img-container {padding-right: 0 pixels; Padding-left: 0 pixels; Text-line: -moz-center; }  

or

  .img-container {padding-right: 0px; Padding-left: 0 pixels; Text align: -webkit-center; }  

This is not for Firefox nor for Safari and Chrome:

  .img-container {padding-right: 0px; Padding-left: 0 pixels; Text align: center; }  

I'm sure there is a solution that works universally. Thanks!

The browser prefix is ​​used for experimental features that are not yet ready for normal use Or based on the parts of the CSS space which have not yet been finalized.

Text-Align: Center exists since the beginning of time and therefore anytime the prefix Is not required just write ...

  .img- container {padding-right: 0 pixels; Padding-left: 0 pixels; Text align: center; }  

The reason for this does not work for your image is img-responsive class. In Bootsrap, this creates a block element on your image, block elements can not be aligned to text-align .

Bootstrap 3 has an built-in center-block class that should be added to the IMG tag ...

  & lt; Div class = 'Col-xs-12 col-sm-4 col-lg-4 img-container' & gt; & Lt; Img class = "img- centric block about img-" src = 'img / about5001000.jpg' & gt; & Lt; / Div & gt;