div 기반 테이블의 고르지 않은 행 정렬

Question

이미지를 셀 데이터로 사용하는 div가있는 테이블이 있습니다. 내가 누락 된 이미지가 있다면, 본질적으로 같은 행에있는 다른 이미지를 가운데에 맞출 :

모든 이미지 :

xxxxx 
xxxxx 

누락 된 이미지 (두 번째 행에서 2) :

xxxxx 
xxx 

xxxxx 
xxx 

CSS :

현재

, 난 단지 결과가 왼쪽 정렬 얻을 수

.table 
{ 
    margin-top:5px; 
    margin-left:15px; 
    margin-right:15px; 
    display: table; 
    width:auto; 
    border-spacing:0px; 
} 

.row 
{ 
    display:table-row; 
    width:auto; 
    margin-left:auto; 
    margin-right:auto; 
} 

.cell 
{ 
    float:left; 
    display:table-column; 
    width:auto; 
} 

행에 대해 왼쪽/오른쪽으로 자동 여백을 시도했지만 주사위는 사용하지 않았습니다. 어떤 제안?

편집

<div class="table"> 
     <div class="row"> 
      #if ($has1) 
       <div class="cell"><a href="#1"><img src="1.jpg" width="138"/></a></div> 
      #end 
      #if ($has2) 
       <div class="cell"><a href="2"><img src="2.jpg" width="138"/></a></div> 
      #end 
      #if ($has3) 
       <div class="cell"><a href="#3"><img src="3.jpg" width="138"/></a></div> 
      #end 

     </div> 
     <div class="row"> 
      #if ($has4) 
       <div class="cell"><a href="#4"><img src="4.jpg" width="138"/></a></div> 
      #end 
      #if ($has5) 
       <div class="cell"><a href="5"><img src="5.jpg" width="138"/></a></div> 
      #end 
      #if ($has6) 
       <div class="cell"><a href="#6"><img src="6.jpg" width="138"/></a></div> 
      #end 

     </div> 
    </div> 

Answer 1

확인이 시도 :

이

.table 
{ 
    margin-top:5px; 
    margin-left:15px; 
    margin-right:15px; 
    display: table; 
    width:auto; 
    border-spacing:0px; 
} 

.row 
{ 
    display:table-row; 
    width:auto; 
    margin-left:auto; 
    margin-right:auto; 
    text-align:center; 
} 

.cell 
{ 
    /*display:table-column;*/ 
    display:inline-block; 
    width:auto; 
}​ 

예 : http://jsfiddle.net/JARQs/

Answer 2

이 시도 :

.row 
{ 
    display:table; 
    width:auto; 
    margin-left:auto; 
    margin-right:auto; 
    text-align:center; 
} 

디스플레이가있는 컨테이너를 사용할 수도 있습니다. 표 css 및 mantain 원본 .row css 클래스