兩個div滿和固定寬度

我想在主容器中並排放置兩個div，底部div應該適應其餘空間的寬度。兩個div滿和固定寬度

<div id="container"> 
    <div id="left">fixed width</div> 
    <div id="right">rest of space width</div> 
</div> 

#container { 
    float:left; 
    width:100%; 
} 
#left, #right { 
    padding:50px; 
    background: #ccc; 
    vertical-align: bottom; 
    display: inline-block; 
    /* ie6/7 */ 
    *display: inline; 
    zoom: 1; 
} 

#right { 
    padding:20px; 
    background:#000; 
    color:#fff; 
}

我停留在這個階段http://jsfiddle.net/Z9qW3/7/

來源

2013-09-26 Megadevice

類似的問題已經被問：http://stackoverflow.com/questions/6487085/two-divs-one-fixed-width-the-other-the-rest?rq=1 – sekky

我看到它，但如果我讓我的權利適應其餘的空間，這是不是底部位置 – Megadevice

我昨天回答了類似的問題： http://stackoverflow.com/questions/19003663/divs-arrangement-html-css/19004191#19004191 –

試試這個代碼：

Demo

CSS

#left 
{ 
width:20%;float:left;position:fixed;left:0px; 
border:1px solid yellow; 
} 
#right 
{ 
width:80%;float:right; 
border:1px solid red; 
}

HTML

<div id="container"> 
    <div id="left">fixed width</div> 
    <div id="right">rest of space width</div> 
</div>

來源

2013-09-26 08:33:42 Sandip

下面看到我的回答，以及如何解決我的右側div仍處於最高位置的問題？我需要將我的右側底部移動到底部位置。 – Megadevice

@Megadevice檢查此[鏈接]（http://jsfiddle.net/A2she/2/） – Sandip

這並不令人興奮，我的意思。看看我的第一篇文章。我只想伸展我的右div div的寬度，我不能這樣做，因爲如果我伸展我的div它回到頂端的位置。 – Megadevice

我可以從你的問題得到的是你想在左側的固定股利和其他DIV應採取右側和左格底部的剩餘空間。我認爲更好的辦法是使一個單一的大格，然後漂浮在留下了固定的股利，然後你可以用剩餘部分用CSS定位屬性各個元素

來源

2013-09-26 09:02:44 Mandeep

#container 
{ 
    overflow-x:hidden 
} 
#left 
{ 
width:20%; 
float:left; 
position:fixed; 
border:1px solid red 
} 
#right 
{ 
width:80%; 
float:right; 
position:absolute; 
left:20%; 
bottom:0; 
border:1px solid red 
}

來源

2013-09-26 09:18:51 RiKo

希望這將有助於定位.. 。

#container { 
    width: 100%; 
} 

#left { 
    padding: 50px; 
    background: #ccc; 
    vertical-align: bottom; 
    display: inline-block; 
    /* ie6/7 */ 
    *display: inline; 
    zoom: 1; 
    float:left; 
} 

#right { 
    padding-top: 20px; 
    padding-bottom: 20px;  
    background:#000; 
    color:#fff; 
    width: 79%; 
    float: right;  
}

來源

2013-09-26 09:37:58 Mahib

右div仍然回到最高位置 – Megadevice

兩個div滿和固定寬度

回答

相關問題