一共有三个div，d1，d2，d3，我希望d1可以垂直包裹内容，水平可见。
如果 d2 和 d3 没有 float 属性，d1 会给我我想要的结果。
但 d2 和 d2 具有 float 属性，我需要添加 overflow-y:auto 使其垂直环绕。
我添加了 overflow-x:visible，但它仍然有一个滚动条。
那么如何保持水平可见呢？
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<style>
#d1
{
background-color:red;
padding:10px;
width:100px;
overflow-x:visible;
overflow-y:auto;
}
#d2
{
background-color:blue;
float:left;
width:150px;
height:30px;
}
#d3
{
background-color:green;
float:left;
width:50px;
height:230px;
}
</style>
</head>
<body>
<div id="d1">
<div id="d2">in</div>
<div id="d3">
out
</div>
</div>
</body>
</html>
最佳答案
如果我理解你的问题，你可以使用“清晰”的 DIV 来解决这个问题。编辑代码:
CSS
<style>
#d1
{
background-color:red;
padding:10px;
width:100px;
overflow-x:visible;
}
#d2
{
background-color:blue;
float:left;
width:150px;
height:30px;
}
#d3
{
background-color:green;
float:left;
width:50px;
height:230px;
}
.clear{
clear:both;
}
</style>
HTML
<div id="d1">
<div id="d2">in</div>
<div id="d3">out</div>
<div class="clear"></div>
</div>
关于css - 垂直自动时如何使用CSS保持水平可见？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/11218688/