0

我有这段 html 代码。我喜欢 wuiLeftArea 和 wuiMainArea 始终并排。现在,当缩小浏览器窗口时,WuiMainArea div 低于 wuileftArea。有没有办法强制 wuiMainArea div 始终保持在右侧?

<div id="wuiLeftArea">
        <div id="wuiLefthandNavRoot">
            <div id="tree">
            </div>
    </div>
</div>

<DIV id=wuiMainArea sizcache="5" sizset="1">
    <DIV id=wuiMainContent sizcache="5" sizset="1">
        <DIV id=wuiInpageNav sizcache="5" sizset="1">
              <DIV id=chart class=wui-inpage-container style="float:right; width: 1200px;min-height:500px;display: block; overflow: hidden;">
              <p > this is the area to put charts. this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                        this is the area to put charts. 
                </p>
            </DIV>
        </DIV>
    </DIV>
</DIV>
4

3 回答 3

1

使用基于百分比的长度。如果左侧容器占页面宽度的 25%,而主容器占页面宽度的 75%,那么无论浏览器变得多小,您都会有 1/4 3/4 的拆分

于 2013-02-25T15:24:52.680 回答
1

http://jsfiddle.net/XCEjf/

.wui-inpage-container {
    width: 50%;
}

通过使用相对宽度,您可以让浮动始终在页面宽度中留出空间,从而防止换行。

于 2013-02-25T15:24:37.423 回答
1

除非容器上有固定大小或明确设置溢出,否则这种情况总是会发生;否则,每当调整任何容器的大小时,它都会重新排列其子级以适应宽度方向的身体。

于 2013-02-25T15:23:25.100 回答