我有 2 个 float div,我想将它们放在同一行上,它们加起来超过 1024 像素宽,因此它们需要水平窗口滚动,但尽管它们用 white-space:nowrap;< 包裹在一个 div 中
div 将中断并出现在两行上。我在这段代码中有什么问题吗?谢谢。
.wrapper{
white-space:nowrap;
}
.content{
float:left; width:600px; height:20px;
}
<div class = "wrapper">
<div class = "content" style = "background-color:red;"></div>
<div class = "content" style = "background-color:blue;"></div>
</div>
最佳答案
为 .wrapper
指定固定宽度可以解决您的问题
.wrapper {
white-space: nowrap;
width: 1300px;
}
更新
或者,您可以为您的 .content
设置 display: table-cell
并为它们设置一个 min-width
.content {
display: table-cell;
height: 45px;
min-width: 600px;
overflow: auto;
}
关于html - nowrap wrapper 内的 div 断线,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16152966/