Html 如果不需要，CSS 隐藏滚动条
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/18716863/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
CSS hide scroll bar if not needed
提问by Thanos Paravantis
I am trying to figure out how I can hide the overflow-y:scroll;if not needed. What I mean is that I am building a website and I have a main area which posts will be displayed and I want to hide the scroll bar if content does not exceed the current width.
我想弄清楚如何隐藏overflow-y:scroll;不需要的。我的意思是我正在构建一个网站，我有一个主要区域，将显示帖子，如果内容不超过当前宽度，我想隐藏滚动条。
Also, my second question. I want to make it so when the posts exceed the current width, the width will increase automatically and the content won't go out of the box.
另外，我的第二个问题。我想让它当帖子超过当前宽度时，宽度会自动增加并且内容不会开箱即用。
Does anyone have a clue how to do this?
有谁知道如何做到这一点？
Posts area:
帖子区：
.content {
height: 600px;
border-left: 1px solid;
border-right: 1px solid;
border-bottom: 1px solid;
font-size: 15px;
text-align: justify;
line-height: 19px;
overflow-y:scroll;
}
Main website container:
主网站容器：
.container {
margin: 0 auto;
width: 757px;
margin-top: 30px;
text-align: center;
}
回答by RJo
Set overflow-yproperty to auto, or remove the property altogether if it is not inherited.
将overflow-yproperty设置为auto，或者如果它不是继承的，则完全删除该属性。
回答by Ayyappan K
You can use overflow:auto;
您可以使用 overflow:auto;
You can also control the x or y axis individually with the overflow-xand overflow-yproperties.
您还可以使用overflow-x和overflow-y属性单独控制 x 或 y 轴。
Example:
例子：
.content {overflow:auto;}
.content {overflow-y:auto;}
.content {overflow-x:auto;}
回答by Ayyappan K
You can use both .content and .container to overflow:auto. Means if it's text is exceed automatically scroll will come x-axis and y-axis. (no need to give separete x-axis and y-axis commonly give overflow:auto)
您可以同时使用 .content 和 .container 来溢出：自动。意味着如果它的文本超过自动滚动将来到 x 轴和 y 轴。（无需给出单独的 x 轴和 y 轴，通常给出溢出：自动）
.content {overflow:auto;}
.content {溢出：自动；}
回答by Prateek Arora
.selected-elementClass{
overflow-y:auto;
}
回答by Neero
.container {overflow:auto;} will do the trick. If you want to control specific direction, you should set auto for that specific axis. A.E.
.container {overflow:auto;} 可以解决问题。如果要控制特定方向，则应为该特定轴设置自动。AE
.container {overflow-y:auto;} .container {overflow-x:hidden;}
.container {overflow-y:auto;} .container {overflow-x:hidden;}
The above code will hide any overflow in the x-axis and generate a scroll-bar when needed on the y-axis.But you have to make sure that you content default height smaller than the container height; if not, the scroll-bar will not be hidden.
上面的代码将隐藏 x 轴上的任何溢出，并在需要时在 y 轴上生成一个滚动条。但是您必须确保您的内容默认高度小于容器高度；如果没有，滚动条将不会被隐藏。
