在div容器內定位按鈕

我試圖讓3盒（邊到邊）對齊到頁面的中心。

<div class="wrapper"> 
<a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank"></i> MEDIA</a> 
<div class="spacer"/> 
<a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank"></i> STUDIO</a> 
<div class="spacer"/> 
<a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank"></i> DESIGN</a> 
</div>

CSS的包裝

.wrapper { 
    padding-top: 100px; 
    text-align: center; 
}

CSS的間隔

.spacer { 
    display: inline; 
    margin: 50px 50px; 
    position: relative; 
    text-align: center; 
}

我會很感激任何幫助！

來源

2014-02-11 rwhashash

DIV不自結束標記 – Morpheus

..和格作 '間隔' 只是普通的** **不好 –

謝謝，正如Morpheus和LorDex建議集中按鈕一樣關閉div。 – rwhashash

忘記那些間距div，HTML不適合造型。

在你的鏈接上使用display: inline-block，你可以簡單地把裕度放在它們上面。

HTML：

<div class="wrapper"> 
    <a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank">MEDIA</a> 
    <a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank">STUDIO</a> 
    <a class="btn btn-large" href="URL TO YOUR SUBSITE" target="_blank">DESIGN</a> 
</div>

CSS：

.wrapper { 
    text-align: center; 
} 

.wrapper .btn { 
    display: inline-block; 
    margin: 50px 25px; 
}

Working demo

來源

2014-02-11 16:40:56 kapa

這解決了我的問題。我很感激。 – rwhashash

在div容器內定位按鈕

回答

相關問題