绝对定位和窗口调整大小

时间:2013-10-07 18:45:43

标签: html

有两个div标签绝对定位。 关键是要防止第一个窗口调整窗口右侧的窗口大小超过总宽度。 附: :这只发生在firefox中。

<!doctype html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>My HTML File</title>
    <style>
        body{
            direction: rtl;
        }
        #sidebar{
            position: absolute;
            top: 0;
            right: 0;
            bottom: 0;
            width: 300px;
            min-height: 1000px;
            background-color: #66ccff;
        }
        #content{
            position: absolute;
            top: 0;
            right: 300px;
            bottom: 0;
            left: 0;
            min-width: 1100px;
            background-color: #008844;
        }
    </style>
</head>
<body>
<div id="sidebar"></div>
<div id="content">
</div>
</body>
</html>

1 个答案:

答案 0 :(得分:0)

left: 0;

中删除#content
#content {
    position: absolute;
    top: 0;
    right: 300px;
    bottom: 0;
    /*left: 0;*/
    min-width: 1100px;
    background-color: #008844;
}

JSFiddle