父DIV

2011-11-12 131 views
1

內圍繞2個格,我面臨這個問題父DIV

#sub-title { 
    width: 700px; 
    margin: 0 auto; 
    text-align:center; 
} 
#sub-left { 
    float: left; 
} 
#sub-right { 
    float: left; 
} 
.clear-both { 
    clear: both; 
} 

<div id="sub-title"> 
    <div id="sub-left"> 
     sub-left 
    </div> 
    <div id="sub-right"> 
     sub-right 
    </div> 
    <div class="clear-both"></div> 
</div> 

小提琴:http://jsfiddle.net/bGF7E/

我怎麼中心分左,子吧?請忽略註釋的名稱。

回答

2

你的問題中沒有很多細節。

如果您不指定浮動寬度div的寬度,它們只會與其內容一樣寬。

div是700個像素寬,所以中心的兩個浮動div的,你必須設置它們的寬度......

http://jsfiddle.net/bGF7E/6/

http://jsfiddle.net/bGF7E/6/show/

另外,如果你'd喜歡內容來決定浮動寬度div的寬度,您可以簡單地將右邊的div浮動到右邊。

http://jsfiddle.net/bGF7E/11/

http://jsfiddle.net/bGF7E/11/show/

+0

您的解決方案要求您手動添加3個寬度。如果你想改變其中的一個,這很不方便,特別是當你處理大量的CSS規則時。 – fflorent

+0

@florent,你是不正確的......我只在第一個例子中給OP的例子添加了_two_的寬度,在我的第二個例子中沒有添加寬度。我的第一個解決方案除了設置寬度之外不需要其他任何東西,只要使用一個'class',而不是在'id'上設置單獨的寬度。 – Sparky

-2

這是你想要的嗎?

http://jsfiddle.net/EbskM/

如果沒有,你能帶來更多的精度你想要什麼,請?

+1

你把它們放在一個'桌子......真的嗎? – Sparky

+0

是的,這是怎麼回事? 表格是垂直佈局的好元素。 – fflorent

+1

當然,如果這是1999年,'table'對於佈局來說是非常棒的。但是現在是2011年了,現在正確的佈局是用CSS來完成的。這一切都在旁邊,因爲OP特別詢問了如何將兩個'div'與CSS集中在一起,並且您的答案不會用來實現結果。 – Sparky