当小于最小宽度时,Div滚动

Question

我有2个div,侧边栏和主窗格.

.main {
    position: absolute;
    min-width: 400px;
    top: 0;
    bottom: 0;
    left: 200px;
    right: 0;
    overflow: auto;
}

.leftSidebar {
    position:absolute;
    top:0;
    bottom:0;
    left:0;
    width: 200px;
    padding-left: 10px;
    overflow-x: auto;
    overflow-y: scroll;
}

我希望主div在大小小于400px时有一个水平滚动条,但是当内容只是在它减少时才会切断它.我错过了什么？

如果这有帮助,这是一个演示.理想情况下,更改窗口的宽度应该向主div添加滚动条,但它只将滚动条放在整个窗口上.

Answer 1

解决方案:http://jsfiddle.net/nnt7ctjr/

通过给出.maina min-width强制它保持在那些尺寸并溢出视口外,因此整个屏幕出现滚动条.

因此,解决方案是模仿这种效果.main.我创建了另一个对象span.content并给了它min-width:400px;.现在,400px当.maindiv继续缩小时,文本将保留维度.