嘗試將多個圖像居中

這在xD中一直在做我的頭，基本上我試圖以圖像爲中心，但是第一個被引用的圖像例如imgTop似乎是中間圖像，而另一個則轉到了對。我想均勻地居中。在此先感謝嘗試將多個圖像居中

#imageContainer { 
 
    width: 100%; 
 
    text-align: center; 
 
} 
 
.imgTop { 
 
    display: inline-block; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    width: 60px; 
 
    height: 40px; 
 
    padding-left: 85pt; 
 
    padding-right: 85pt; 
 
} 
 
.imgBottom { 
 
    display: inline-block; 
 
    margin-left: auto; 
 
    margin-right: auto; 
 
    width: 60px; 
 
    height: 40px; 
 
    padding-left: 85pt; 
 
    padding-right: 85pt; 
 
}

<div id="imageContainer"> 
 
    <div class="imgTop"> 
 
    <a class="imageSlot"> 
 
     <img src="src/gameImages/img3.jpg"> 
 
    </a> 
 
    </div> 
 
    <div class="imgTop"> 
 
    <a class="imageSlot"> 
 
     <img src="src/gameImages/img4.jpg"> 
 
    </a> 
 
    </div> 
 
</div> 
 

 
<div id="imageContainer"> 
 
    <div class="imgBottom"> 
 
    <a class="imageSlot"> 
 
     <img src="src/gameImages/img4.jpg"> 
 
    </a> 
 
    </div> 
 
    <div class="imgBottom"> 
 
    <a class="imageSlot"> 
 
     <img src="src/gameImages/img3.jpg"> 
 
    </a> 
 
    </div> 
 
</div>

來源

2015-10-23 CJB

似乎做工精細 - http://jsfiddle.net/jo7sv81m/ **注*：您正在使用的ID不止一次而這不允許，所以我把這個轉換成一個班級。無論是你看到的問題的一部分，我都不知道。 –

如果您可以在演示中複製問題，我們可能會提供幫助。 –

如果圖像應該緊挨着對方...只是刪除填充 - http://jsfiddle.net/jo7sv81m/2/ –

不知道如果我這樣做是正確...但你想同時picutres是在中間，而不是隻有一個？所以我做了1個div標籤，並將它們放在一起。

<div id="imageContainer"> 
     <div class="imgTop"> 
      <a class="imageSlot"><img src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png"></a> 
      <a class="imageSlot"><img src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png"></a> 
     </div> 
    </div> 

    <div id="imageContainer"> 
     <div class="imgBottom"> 
      <a class="imageSlot"><img src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png"></a> 
      <a class="imageSlot"><img src="http://zoarchurch.co.uk/content/pages/uploaded_images/91.png"></a> 
     </div> 
    </div>

這裏是我的小提琴：https://jsfiddle.net/gswq55x2/

來源

2015-10-23 11:43:36

嘗試將多個圖像居中

回答

相關問題