html - 没有固定高度的溢出DIV内容

Question

我有两个 div:左和右。左边有很长的文字。在右边有一些关于文本的注释(更多的 div)。如果左边的文字比我喜欢的注释长。但是当注释比左边的 div 更大/更长时，我想让右边的 div 的内容溢出。

换句话说:两个没有固定高度的div，让右边的溢出。

代码在上面或者JSFiddle

<div id="container">
    <div id="left">Some long-long text, allways to show</div>
    <div id="right">Some divs not necessarily show all</div>
</div>

CSS:

#container {
    background-color:white;
    float:left;
}

#left {
  width: 79%;
  float:left;
}

#right {
  width: 19%; 
  float:right;
  overflow: hidden;
}

但它不起作用。 :(

Answer 1

正如 Jan 在上一条评论中所建议的，我认为您需要使用 javascript 或 jQuery 来完成此任务。

这question概述了一种使用被 OP 接受的 javascript 的方法，尽管 OP 没有对他的执行过程发表任何评论。

我修改了一个 js fiddle来自这个answer类似的问题。

它使用以下内容:

CSS

#main{
    width:auto;    

}

#one{
height:auto;
width:200px;
display:inline-block;
float:left;

}
#two{
height:100%;
width:200px;
float:left;
display:inline-block;
overflow: auto;

}

div{
border:1px solid black;
}

Javascript

$(document).ready(function() {

        $("#main").css("height",$("#one").height());


 });

我相信可以解决您想要的结果。