Ng-table: How to show horizontal scroll bar when there are many columns needed to be shown in one table?

Created on 28 Nov 2015  ·  4Comments  ·  Source: esvit/ng-table

qq 20151128203444
The page shows scroll bar,but not in the table.

Most helpful comment

you need to surround table with div say
<div id="container"><!--table here--></div>

In css apply following style to container div
#container{white-space:nowrap; overflow: hidden;}

then apply following style to your table
.table{display:block;overflow-x:scroll;}

This will add horizontal scrollbar just below the table and before the pager div.

All 4 comments

Create a container above it.
<div id="container"> <!--your table --> </div>
And using css do:
#container { width:100%; overflow: auto }

@AmitMY will hide the pager

+1,need a container for the table element

you need to surround table with div say
<div id="container"><!--table here--></div>

In css apply following style to container div
#container{white-space:nowrap; overflow: hidden;}

then apply following style to your table
.table{display:block;overflow-x:scroll;}

This will add horizontal scrollbar just below the table and before the pager div.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

yujiayinshi picture yujiayinshi  ·  8Comments

Nagendra1402 picture Nagendra1402  ·  3Comments

Ebolon picture Ebolon  ·  12Comments

muhlegg picture muhlegg  ·  29Comments

zam6ak picture zam6ak  ·  20Comments