Question

不确定为什么顶部和底部都设置为0px;但是当使用Opera 11.50然后最小化opera然后从任务菜单打开它时会发生什么是设置为顶部和底部的某个div元素0px如果你调整窗口的大小就会在底部显示一些空的空间最小化程序并将其打开到最大尺寸会使位置变得混乱：绝对元素。

以下代码可以告诉我为什么会出现这种情况以及我如何解决它。

#Panel {
background-color: #fff;
border-right-color: #cdcdcd;
border-right-style: solid;
border-right-width: 1px;
bottom: 0px;
box-shadow: 0px 0px 5px #1b1b1b;
left: 0px;
position: fixed;
text-shadow: 0px 1px 0px;
top: 0px;
width: 280px;
z-index: 3;
}

JSFiddle：http://jsfiddle.net/PcrUB/1/＆lt; - 完整代码+其他

Answer 1

如果我正确理解这一点，您希望面板全高 - 始终从上到下伸展？虽然内容位于右侧并滚动？我猜一点，所以，对不起，如果这不是你想要做的......

虽然我认为这个位置：修复问题可能实际上是一个Opera错误，你可以通过将其改为position：absolute来避免它。它似乎在没有错误的情况下给出相同的结果。

此测试用例似乎适用于Opera 11.5，IE9，FF5，Chrome 13：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=EDGE">
    <title>Page Title</title>
    <style>
    body { background: #cdcdcd; overflow: hidden; }
    #Panel {
        background: #fff;
        border-right: 1px solid #cdcdcd;
        box-shadow: 0px 0px 5px #1b1b1b;
        text-shadow: 0px 1px 0px;

        position: absolute;
        top: 0px;
        right: 280px;
        bottom: 0px;
        left: 0px;

        width: 280px;
    }

    #Content { 
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 285px;
        overflow: auto;
    }
    </style>
</head>
<body>
    <div id="Panel">
         <div id="Panel_Logo"></div>
        <p>panel</p>    
    </div>
    <div id="Content">
         <div id="Content_Header"></div>
         <p style="height: 2000px;">Forced-height paragraph to induce scrolling.</p>
         <p>end</p>
    </div>
</body>
</html>

希望有所帮助。

职位固定不起作用

1 个答案: