comment centrer images à l'intérieur du div

Question

Im essayant de centrer les images à l'intérieur des .pics div, mais le css ne fonctionne pas

<article class="pics"> 
     <ul> 
      <li><img class="default" alt="cake" src="images/IMG_2774_opt.jpg"></li> 
      <li><img class="default" alt="cake" src="images/198_opt.jpg"></li> 
      <li><img class="default" alt="cake" src="images/IMG_2774_opt.jpg"></li> 
     </ul> 
</article> 

CSS: .pics { width: 100%; vertical-align: middle; }

ne fonctionne pas

Answer 1

Je voudrais vous indiquer une solution très simple

http://www.w3.org/Style/Examples/007/center.en.html

IMG.displayed { 
    display: block; 
    margin-left: auto; 
    margin-right: auto } 
... 
<IMG class="displayed" src="..." alt="..."> 

Answer 2

http://jsfiddle.net/bth9g/

HTML:

<div class="center" > 
    <div class="centered"> 
     <div class="img"></div> 
    </div> 
</div> 

CSS:

.center{ 
    height:200px; 
    width:200px; 
    background:black; 
    display:table; 
} 
.centered{ 
    display:table-cell; 
    vertical-align:middle; 
    text-align:center; 
} 
.img{ 
    display:inline-block; 
    background:yellow; 
    height:50px; 
    width:50px; 
}