0

我知道标题没有意义，但我不知道该怎么说。

看看这个：http: //jsfiddle.net/nr33k/embedded/result/

我想增加右侧井的高度以匹配左侧两个井的高度，所以看起来我在一个大矩形中有三个小井。如果我尝试通过添加明显的方式来增加高度，height:150px则会导致左侧的底部井落下。我该如何解决这个问题？

4

4 回答 4

1

请尝试float:left;您的row班级，然后在右侧设置跨度的高度。

.row {float:left;}

这是一个工作示例http://jsfiddle.net/BUgQc/

于 2012-12-03T13:10:21.423 回答
0

在一个 DIV 中制作左侧两个 DIV 并将其向左浮动，并使右侧更大 Well div 在一个 DIV 中，如果离开则浮动....希望这对您有所帮助....

于 2012-12-03T12:43:31.117 回答
0

问题是前两个“井”在一行中，而第三个在另一行中。

试试这个：

<div class="row">
  <div class="span4">
    <div class="well well-small" style="height:50px">
      <p>hello</p>
    </div>
    <div class="well well-small" style="height:100px">
      <p>hello again</p>
    </div>
  </div>
  <div class="span8">
    <div class="well well-small" style="height:190px;">
      <p>hello one more time</p>
    </div>
  </div>
</div>
于 2012-12-03T12:51:13.237 回答
0

检查这个例子。希望能帮助到你

HTML

<div id="container2">        
    <div id="container1">
        <div id="col1" style="height:250px">
            <!-- Column one start -->
            <h2>Equal height columns</h2>           
            <!-- Column one end -->
        </div>

        <div id="col2">
            <!-- Column two start -->            
            <h3>Mac</h3>           
            <!-- Column two end -->
        </div>            
    </div>
</div>​

CSS

#container2 {
    float:left;
    width:100%;
    background:yellow;
    position:relative;
    right:30%;
}
#container1 {
    float:left;
    width:100%;
    background:red;
    position:relative;
    right:40%;
}
#col1 {
    float:left;
    width:26%;
    position:relative;
    left:72%;
    overflow:hidden;
}
#col2 {
    float:left;
    width:36%;
    position:relative;
    left:76%;
    overflow:hidden;
}​

演示

来源链接

于 2012-12-03T12:57:36.540 回答