0

在 JSP 页面上，我们使用嵌套的 div 显示了一个树状结构。每个 div 的宽度是在运行时计算的。运行时仅给出“div1”的宽度，其他 div 的宽度在运行时使用它计算。这里，我将其设置为 200px。

<div id="div1" style="background-color:#EEEEEE;height:200px;width:200px;float:left;overflow:auto">
    <div id="div2" style="background-color:yellow;height:200px;width:190px;">
        <div id="div3" style="background-color:blue;height:180px;width:180px;"></div>
        <div id="div4" style="background-color:red;height:180px;width:50px;"></div>
    </div>
</div>

现在的问题是“div4”没有附加在“div3”的右侧。它被放置在下一行。因为那个树结构被扰乱了。如果我增加“div2”的宽度，那么它会放在右边，但是对于所有不需要它的情况，水平滚动条都会出现。我注意到 div 的行为是垂直而不是水平放置文本。知道如何使它工作吗？

4

1 回答 1

0

这是你的想法吗？我创建了一个 jsfiddle：http: //jsfiddle.net/r6sPY/

只要 div2 的宽度小于 div3 和 div4 的总和，div4 就永远不会附加到 div3 的右侧。但是话又说回来，我不确定这是否是您的想法。

<div id="div1" style="background-color:#EEEEEE;height:200px;width:200px;float:left;overflow:auto">
<div id="div2" style="background-color:yellow;height:200px;width:190px;">
    <div id="div3" style="background-color:blue;height:180px;width:130px;float:left;"></div>
    <div id="div4" style="background-color:red;height:180px;width:50px;float:left;"></div>
</div>
</div>
于 2013-02-28T09:46:00.070 回答