如何阻止水平滚动条影响 div 中文本的垂直对齐？我希望文本居中，滚动条可以在它下面。
是否也可以将滚动条放在外部 div 的底部(不影响其高度)并影响内部 div 的滚动？
.outer {
width: 50%;
padding: 30px;
background-color: #008000;
}
.inner {
border: 1px solid red;
height: 50px;
overflow: scroll;
white-space: nowrap;
}<div class="outer">
<div class="inner">
Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nullam eget nulla ac leo ullamcorper tristique. Donec lobortis a dolor sit amet congue. Etiam nisl lectus, euismod id enim ac, pretium blandit lectus. Cras congue placerat purus in malesuada. In
ex dui, iaculis id nisi eget, fermentum condimentum ante. Etiam a facilisis justo, vitae auctor lacus. Duis at nisi sed lacus tincidunt accumsan at id lacus. Praesent at luctus velit, eget interdum turpis.
</div>
</div>截图
红线在中间，文本需要在那里，这不是因为它使整个 div 居中，包括其中的滚动条
最佳答案
您可以使用 flex 轻松地使文本垂直居中:
.inner {
display: flex;
align-items: center;
border: 1px solid red;
height: 50px;
overflow: scroll;
white-space: nowrap;
}
.text {
margin: auto;
}
<html>
<body>
<div class="outer">
<div class="inner">
<p class="text">Text here</p>
</div>
</div>
</body>
</html>
关于 div 外部滚动条的第二个问题，我认为你做不到，但也许这里有人有解决方案:)
关于html - div的水平滚动条影响垂直对齐，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/49364534/