Question

我在我的页面尝试这个主要的包装风格..最初是好的..但因为左窗格的最小宽度我的右窗格在我调整窗口大小时下降。可以请任何人帮助如何保持调整大小时右窗格可调。但我们不应该改变最小宽度。

<body >
<div class="master-container">

    <div class="left-panel"></div>
    <div class="right-panel"></div>

</div>
</body>

.left-panel{
    float: left;
    width: 18%;
    left: 0;
    height: 200px;
    min-width: 256px;
    border: 1px solid #294777;
    box-sizing: border-box;
}       
.right-panel {
    float: left;
    width: 82%;
    min-width: 700px !important;
    max-height: 764px;
    overflow-y: auto;
    border: 1px solid #294777;
    height: 200px;
    box-sizing: border-box;
}

Answer 1

我很难建议，因为我不了解你在这些div中的回应和内容方面的目标。

也许这可能是你的开始：

根据评论

更新。

<强> FIDDLE HTML：

<div class="master-container">
    <div class="left-panel"></div>
    <div class="right-panel">
        <div class="in"></div>
    </div>
</div>

CSS：

.master-container{
    min-width:984px;
}
.left-panel {
    float: left;
    width: 26%;
    left: 0;
    height: 200px;
    min-width: 256px;
    background:green;
}
.right-panel {
    width:72%;
    min-width:728px;
    max-height: 764px;
    overflow-y: auto;
    height: 200px;
}
.in{
    width:100%;
    min-width:728px;
    height: 200px;
    background:blue;
}

调整窗口大小时对齐更改

1 个答案: