0

我有一个主 div，里面有 3 个 div

在正常情况下，它工作得很好，我需要完全相同的东西，但由于某种原因，如果我调整浏览器的大小，右侧的一个 div 会向下浮动，我想出了它的原因，但我不知道如何解决它。div 向下浮动是由于我给了 div 的边框，但我已经用完美的计算给了边框，但我不知道为什么它仍然会发生

HTML

<div class="box">
    <div class="box_top"></div>
    <div class="box_left"></div>
    <div class="box_right"></div>
</div>

CSS

.box{
    width:500px;
    height:300px;
}
.box_top{
    width:500px;
    height:49px;
    border-bottom:rgb(239,239,239) 1px solid;
    background-color:#636;
}
.box_left{
    width: 249px;
    height: 250px;
    float:left;
    background-color: #093;
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: #FFF;   
}
.box_right{
    width:250px;
    height:250px;
    float:left;
    background-color:#006;
}

请听听这个问题：http: //jsfiddle.net/gtczu/

4

3 回答 3

2

补充min-width: 500px;一下.box，当浏览器窗口小于 500px 时，会出现水平滚动条。

检查您更新的小提琴

于 2013-08-02T18:38:46.660 回答
1

这是因为您在没有在容器上设置宽度的情况下向左浮动。我会在包含的 div 上设置一个最小宽度或只是一个宽度。

于 2013-08-02T18:53:28.763 回答
0

这是因为在调整大小时，所有内部 div 的总宽度都大于视口大小......这就是为什么最后一个 div 在调整大小时会向下浮动。尝试以百分比表示所有宽度..我认为这个技巧可能工作

于 2013-08-02T18:37:22.980 回答