我無法水平對齊圖像

Question

我似乎無法讓我的圖像並排排列，它們只是保持堆疊在一起。我只有足夠的知識來摸索我的指示，我卡在這裏。

HTML：

<div class='sticky-bar'> 
    <div class='sticky-bar-inner'> 
     <div> 
      <a href='https://www.facebook.com/salvageinteriors' target='_blank'> 
       <img src='img.png' /> 
      </a> 
     </div> 
    </div> 
</div> 

我不能似乎得到的代碼的其餘部分在這裏，但它只是不斷重複以上。

CSS：

.sticky-bar { 
    background: none repeat scroll 0 0 #FFFFFF; 
    bottom: 0; 
    color: #000000; 
    font-weight: 700; 
    left: 10px; 
    margin: 9px; 
    opacity: 0.6; 
    position: fixed; 
    width: 45px; 
    z-index: 62; 
} 

.sticky-bar-inner { 
    display: inline-block; 
    margin-left:auto; 
    padding: 20px 0; 
    text-align: left; 
    width:90%; 
} 

Answer 1

試試這個：

使用浮動：左屬性。它將用於並排對齊div，當達到父寬度時，圖像將在下一行對齊。

HTML：

<div class='sticky-bar'> 
    <div class='sticky-bar-inner'> 
     <div class="inner-divs"> 
      <a href='https://www.facebook.com/salvageinteriors' target='_blank'> 
       <img src='img.png' /> 
      </a> 
     </div> 
    </div> 
</div> 

CSS：

爲.sticky-BAR-內類集寬度

.sticky-bar-inner { 
    padding: 20px 0; 
    width:500px; 
} 

並設置浮動：左屬性內在的形象e divs。

.inner-divs{ 
    float:left; 
}