How to prevent the vertical scroll of this div?

泄露秘密 提交于 2019-12-13 02:15:27

问题


I am not so into CSS and I have the following problem.

I have the following situation: into a page I have a very large table (that was horizontally truncated because it not entered in the page).

So to solve this issue I put this table into a scrollable div, something like this:

<div style="overflow-x: scroll;">
    // Into this div there is my original table
</div>

So I have used the overflow-x: scroll; property because I want that the content of the div is only horizontally scrollable (not vertically). But the problem is that I obtain this output:

As you can see the div content result scrollable also vertically and I don't want it. I can't post a fiddle because the inner table is rendered by a tag library.

How can I fix this issue and obtain only the horizzontal scroll? What am I missing?

Tnx


回答1:


Try

<div style="overflow-x: scroll; overflow-y:hidden;">
    // Into this div there is my original table
</div>



回答2:


The overflow-y: visible; should be there by default, there may be something else causing the scrollbar. Look at the overflow-y value for the various parent divs in Chrome debugger.




回答3:


make the overflow-y:hidden.

<div style="overflow-x: scroll;overflow-y:hidden;">
    // Into this div there is my original table
</div>



回答4:


First give your div <div style="overflow: auto"> and see. If the scroll on the y-axis still shows, type <div style="overflow-x: auto; overflow-y: hidden">.




回答5:


.div {
  overflow-x: scroll;
  overflow-y: hidden;
}
<div class="div">
</div>


来源:https://stackoverflow.com/questions/30938818/how-to-prevent-the-vertical-scroll-of-this-div

易学教程内所有资源均来自网络或用户发布的内容,如有违反法律规定的内容欢迎反馈
该文章没有解决你所遇到的问题?点击提问,说说你的问题,让更多的人一起探讨吧!