2011-11-30 98 views
0

全部, 我想要的是具有包含div的兩列布局。左邊的列可以是固定的長度,那就可以了。然後在右邊的列將需要填寫容器div的其餘部分。我遇到的另一個問題是,右側的列可以有更多的數據,然後是左側的列。我如何使左列的背景或邊框變爲動態的,以便它始終與右列相同?感謝您對此提供的任何建議。CSS使用div創建列布局

回答

-1

,你可以做到這一點使用CSS,只給了兩個div的寬度百分比如下:

<div class="main"> 
    <div class="leftCol"></div> 
    <div class="rightCol"></div> 
</div> 

和CSS:

.leftCol{ 
float:left; 
width:20%; 
} 
.rightCol{ 
float:left; 
width: 80%; 
} 

祝你好運!

+0

這個CSS不會工作。你需要浮動divs +他需要leftCol爲固定寬度,main也已經有100%的寬度,因爲它是一個塊元素,不需要100%的聲明。他需要同等高度的柱子。 – easwee

+0

@easwee:感謝您的評論,我編輯了我的答案。雖然我同意你的觀點,但我的示例不會修正左邊div的固定寬度......最好的方法是使用JavaScript – Cata

+0

並不是真的 - 可以用純CSS完成 - 請參閱SGB答案,這是典型的方法這個問題。 – easwee