2列DIV布局

-1

可能重复：
Simple 2 column div layout
2 column layout in CSS 2列DIV布局

我想建立一个2列DIV布局。其中一列应该右对齐并且自动调整大小，另一列应该填满剩下的剩余空间。

2011-07-21 Cornel

有趣。你有什么尝试？ – Trevor

...并且当您将此问题的标题键入Stack Overflow时，您是否看不到任何相关问题？ – Phrogz

[Simple 2 column div layout]（http://stackoverflow.com/questions/6748178/simple-2-column-div-layout）或[CSS中的2列布局]的副本（http://stackoverflow.com/questions/144375/2-column-layout-in-css）或[DIV only two-column CSS layout]（http://stackoverflow.com/questions/3432304/div-only-two-column-css-layout）或（本网站上已有大量其他相关问题）。 – Phrogz

想要这样http://jsfiddle.net/UNgcd/2/？

HTML：

<div class='wrap'> 
    <div class='right'> 
     <p>some text goes here for auto width</p> 
    </div> 
    <div class='left'> 
     <p>this takes up remaining space to the left</p> 
    </div> 
</div>

CSS：

.right { 
    background-color: red; 
    float: right; 
    width: auto; 
} 

.left { 
    background-color: yellow; 
    overflow: hidden; 
}

来源

2011-07-21 20:02:58 ngen

为什么为'左'列设置'margin-right'不起作用？ – Cornel

适用于我http://jsfiddle.net/UNgcd/3/ – ngen

适用于Google Chrome和FF，但不适用于IE。 – Cornel

HTML：

<div id="right">Auto sized right div</div> 
<div id="left">Auto filling left div</div>

CSS：

#left{ 
    overflow: hidden; 
} 

#right{ 
    float: right; 
}

来源

2011-07-21 20:03:13 Paulpro

http://jsfiddle.net/Paulpro/aCC7b/ – Paulpro

回答

相关问题