0

我要做的是，将两个 div 放在一行中，左侧 div 的宽度是固定的，而右侧 div 的宽度在调整浏览器大小时调整大小（已经实现）。我要实现的是，为右div设置一个resize限制，即右div宽度减小，直到宽度大于等于n px。之后浏览器水平滚动。

（这样做的原因是我在右侧 div 上有一个带有 5 个选项卡的 jquery 选项卡，当我调整浏览器大小时，选项卡会在彼此的按钮上跳开，因此我想停止右侧 div 缩小直到最后一个选项卡）。

到目前为止，这是我的代码：

<div style="float: left; width: 300px; margin-right: 10px; ">

</div>

<div style="overflow: hidden;">

</div>

请让我知道是否有更好的方法将两个 div 放在一行中（左侧宽度固定，右侧可调整大小限制）。

干杯，

4

2 回答 2

1

您将查看最小宽度/最大宽度或@media

对于 min-width 只需给 div2 一个类或 id 并设置 min-width

    #div2{
       min-width:900px;
    }

要控制不同的屏幕尺寸，请使用 @media 并设置最大/最小宽度。

    @media only screen and (max-width: 499px) {
      /* rules that only apply for canvases narrower than 500px */
    }

    @media only screen and (min-width: 500px) {
      /* rules that only apply for canvases wider than 500px */
    }

这里有更多信息：https ://mislav.net/2010/04/targeted-css/

于 2013-03-04T01:22:07.060 回答
0

尝试：

<div class='left'></div>

<div class='right'></div>

<styles>
.left {
    float: left;
    margin-right: 10px;
    width: 300px;
}
.right {
    float: left;
    max-width: 300px;
    overflow-x: auto;
}
</styles>
于 2013-03-04T01:22:33.510 回答