HTML Div使用靜態菜單定位

我知道這可能之前已經講過，但我需要一些專業知識。HTML Div使用靜態菜單定位

我有一個div標籤

<div id="body"> 
    <div id="menu"> 
    </div> 

    <div id="content"> 
    </div> 
</div>

我需要的是菜單浮動左，是200像素和右側的內容坐在旁邊，但100％或任何的剩餘寬度上是什麼？任何想法如何做到這一點？

請參閱http://jsfiddle.net/vBUhD/它可以做的最好嗎？

來源

2012-01-30 TheMonkeyMan

你可以添加一些像這樣我能看到和不能成像它。如果您希望菜單向左浮動並且內容粘貼到該位置。添加浮動：左轉兩者。 – Jashwant 2012-01-30 11:32:54

財產以後像

#menu{ 
float: left; 
width: 200px; 
margin-left: -100%; 
position: relative; 
} 

#content { 
padding: 0 0 0 220px; 
} 

#body { 
width: 100%; 
float: left; 
overflow: hidden; 
}

來源

2012-01-30 11:39:09

你應該能夠得到這個用CSS做過這樣的：

#body { width: 100%; } 

#menu { 
    width: 200px; 
    background-color: lightGray; 
    min-height: 50px; 
    float: left; 
} 

#content { 
    width: 100%; 
    min-height: 50px; 
    background-color: lightBlue; 
}

下面是它的jsfiddle：http://jsfiddle.net/jSUNt/

內容將繞流的菜單在左邊。

來源

2012-01-30 11:39:33

一個例子小提琴：http://jsfiddle.net/AMbRU/

，你可以看到，只需添加float: left到菜單和應用某種清除技術於母公司

來源

2012-01-30 11:42:19 fcalderan