Question

我有任何div用于显示项目的详细信息（类主要）。现在我需要2列。右左。我需要使用30px width和height 100%＆amp;修复正确的div 'auto'和fix in right。左栏height:auto和overflow:hidden。

Html：

<div class="main">
<div class="right">
</div>
<div class="left">
.... Descripton .....
</div>
<div>

CSS：

.main {width:300px; height:auto; overflow:hidden;margin:0 auto;}
.right{width:30px; float:right; height:auto; background-color:#e1e1e1; }
.left{width:270px; float:right; height:auto;}

在线演示我的问题：HERE在这个我看到了正确的div与backgroud-color：＃e1e1e1;

我需要这样：HERE

感谢。

Answer 1

你应该使用绝对位置（位置：绝对）。

浮动：右/左是滥用

<div style="position:relative;width:300px; height:200px;margin:0 auto; background-color:#00ff00;">
 <div style="position:absolute; right:0; top:0;background-color:#ff0000;color:#000;">  Your right content
  </div>
  &nbsp;
  <div style="position:absolute; left:0; top:0;background-color:#0000ff;color:#000;">
    Left content
  </div>
</div>

Answer 2

所以我相信你想在彼此之间制作2列，右栏具有浅灰色背景。

它们都应该是100％的高度。为了使东西100％高，我们还需要将html和body标记设置为100％。

我相信this jsfiddle会做你想要的。请原谅我稍微改变背景颜色，并将左栏设置为overflow: auto进行测试。

Answer 3

以下是一个示例：http://jsfiddle.net/fbUQB/。这就是你要求的，不是吗？

修正div右边的div高度

3 个答案: