当内容大于窗口时,此代码使浏览器具有水平滚动条,溢出到右侧:
div.a {
position: relative;
float: left;
background-color: red;
}
div.b {
position: absolute;
top: 100%;
left: 100%;
background-color: blue;
white-space: nowrap;
}Run Code Online (Sandbox Code Playgroud)
<div class="a">Text1
<div class="b">
Text2 Text2 Text2 Text2 Text2 Text2 Text2 Text2
</div>
</div>Run Code Online (Sandbox Code Playgroud)
但是如果我将第一个div浮动到右边然后第二个位于它左边,浏览器就不会创建一个水平滚动条,并且无法查看溢出的文本.
div.a {
position: relative;
float: right;
background-color: red;
}
div.b {
position: absolute;
top: 100%;
right: 100%;
background-color: blue;
white-space: nowrap;
}Run Code Online (Sandbox Code Playgroud)
<div class="a">
Text1
<div class="b">
Text2 Text2 Text2 Text2 Text2 Text2 Text2 Text2
</div>
</div>Run Code Online (Sandbox Code Playgroud)
我可以以某种方式更改此行为,如果内容大于窗口,则能够向左滚动,向左溢出?
在FF 47,IE 11,Opera 38上测试 …