How to hide vertical scrollbar and show horizontal scrollbar in table in HTML

Question

I want to hide vertical scrollbar and show horizontal scrollbar in talbe in HTML. If I use:

#element::-webkit-scrollbar { 
  display: none; 
}

The result is both vertical and horizontal scrollbar are hidden. So, you can show me how to do with it ?

Welcome to SO. Please take a tour at https://stackoverflow.com/tour — Gaurang Dave, Mar 09 '18 at 09:03

score 0 · Answer 1 · answered Mar 09 '18 at 08:58

0

Try using overflow-y

#element { 
    overflow-y: hidden;
    overflow-x: scroll;
}

answered Mar 09 '18 at 08:58

Claudio

It does not work for me !!! – KTu Mar 09 '18 at 09:04
@KTu try adding you code, for example in a jsfiddle – Claudio Mar 09 '18 at 09:15

score 0 · Answer 2 · answered Mar 09 '18 at 09:00

0

#element{
   overflow-y: hidden;
   overflow-x: scroll;
   }

answered Mar 09 '18 at 09:00

Chandrahas M

score 0 · Answer 3 · answered Mar 09 '18 at 09:00

0

Try using overflow

#element {
    overflow:auto;
}

answered Mar 09 '18 at 09:00

score 0 · Answer 4 · answered Mar 09 '18 at 12:16

0

Try this code

body{
width:100%; 
height:100%;
overflow-y:hidden, 
overflow-y:scroll,
margin:0 
}

answered Mar 09 '18 at 12:16

Abhishek Shah

4 Answers4