我正在尝试实现在外部 div 周围有一个垂直滚动条并且水平内容溢出的效果。
为此，我在我的 style.css 中将 overflow-y 设置为 auto:
.outerdiv {
background-color:brown;
width: 100px;
height: 100px;
overflow-y: auto;
}
和 HTML:
<head>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="outerdiv">
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
<p>xxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxxx</p>
</div>
<body>
</html>
但这同时显示了垂直和水平滚动条。
我如何摆脱水平滚动条并让内部内容(即 xxx's)从 outerdiv 容器的右侧溢出而只有一个垂直滚动条？
请看这个 plunker 示例:https://plnkr.co/edit/ZTODuxvaAv4XN4hGHWu9?p=preview
最佳答案
您只需将 overflow-x 设置为隐藏:
.outerdiv {
background-color:brown;
width: 100px;
height: 100px;
overflow-y: auto;
overflow-x: hidden;
}
关于html - 如何让 overflow-y 产生垂直滚动条，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/42819576/