div中的中心div

Question

我已搜索年齡尋找這個問題的答案！

我正在爲我正在創建的新網站使用12列布局。我有1排4個格：

<div class="colContainer"> 
     <div class="row"> 
      <div class="threecolImg"> 
       <p>Row 1: three</p> 
      </div> 
      <div class="threecolImg"> 
       <p>Row 1: three</p> 
      </div> 
      <div class="threecolImg"> 
       <p>Row 1: three</p> 
      </div> 
      <div class="threecolImg last"> 
       <p>Row 1: three</p> 
      </div> 
     </div> 
    </div> 

我的CSS如下：

.colContainer { 
padding-left: 20px; 
padding-right: 20px; 
} 

.row { 
width: 100%; 
max-width: 1140px; 
min-width: 755px; 
margin: 0 auto; 
overflow: hidden; 
} 

.threecolImg { 
float: left; 
min-height: 1px; 
width: 22.05%; 
} 

，因爲它代表的div都是彼此相鄰（這是很好的！），但不集中（這是不好的！）

可能有人幫我把它們居中？

非常感謝，

保羅

Answer 1

替換threecol div的所有threecolImg的div。他們將被集中。

<div class="colContainer"> 
    <div class="row"> 
     <div class="threecol"> 
      <p>Row 1: three</p> 
     </div> 
     <div class="threecol"> 
      <p>Row 1: three</p> 
     </div> 
     <div class="threecol"> 
      <p>Row 1: three</p> 
     </div> 
     <div class="threecol last"> 
      <p>Row 1: three</p> 
     </div> 
    </div> 
</div> 

而且從你的CSS刪除：

.threecolImg { 
    float: left; 
    min-height: 1px; 
    width: 22.05%; 
} 

如果你想在threecol的div到的影像風格，更喜歡選擇：

.threecol img { 

}