如何將div塊對齊中心（無邊距）

-1

如何將div塊對齊中心。我不需要左右空間。我需要清楚的代碼是一致的內聯元素如何將div塊對齊中心（無邊距）

<div class="wrapper"> 
    <div class="block">1</div> 
    <div class="block">2</div> 
    <div class="block">3</div> 
    <div class="block">4</div> 
    <div class="block">5</div>   
</div> 

.wrapper{ 
    border:1px solid red; 
    width:980px; 
    text-align:center 
} 

.block{ 
    border:1px solid green; 
    width:200px; 
    height:100px; 
    display:inline-block; 
    vertical-align:top; 
}

我可以這樣做： https://jsfiddle.net/yhocvf7p/

.wrapper{ 
    border:1px solid red; 
    width:980px; 
    text-align:left 
} 

.block{ 
    border:1px solid green; 
    width:240px; 
    height:100px; 
    display:inline-block; 
    vertical-align:top; 
    margin-right:123px; 
} 

.block:nth-child(3){ 
    margin-right:0; 
}

，但它不是我所需要的。

來源

2015-03-13 Dj.Sunrise

_但它不是我所需要的。好，你需要什麼？你能告訴我們例如嗎？圖像預期的輸出是什麼？ – panther 2015-03-13 09:24:29

爲了澄清，你希望塊1 - 5從第1行的中心開始水平堆疊，並且當它們在第四個塊的空間不足時，你希望塊5出現在第2行的中心？ – Dpeif 2015-03-13 09:24:48

如果我正確地理解了你想要的結果，那麼這些塊是水平堆疊的，然後當它們用完房間時出現在下一行的中心，你應該可以通過text-align:center屬性來實現這一點。

https://jsfiddle.net/y7rtptxr/1/

#wrapper { 
    border:red 1px solid; 
    text-align:center; 
    width:260px; 
} 
#wrapper .block { 
    background:green; 
    border:#000 1px solid; 
    height:40px; 
    width:60px; 
    display:inline-block; 
}

來源

2015-03-13 09:33:24 Dpeif

如果我找到了你的話，你可以在你的容器上使用font-size: 0;，然後在你的孩子上設置需要的font-size，所以你得到this。

來源

2015-03-13 09:31:29

你需要像this？ http://jsfiddle.net/x2pmjkww/

來源

2015-03-13 09:36:55

如何將div塊對齊中心（無邊距）

回答

相關問題