Menu
I have a website which contains a large (and wide) table. The table is placed inside jquery UI tabs.
It looks something like this: http://jsfiddle.net/Tq3Rg/
For the user this can be somewhat annoying since he has to go all the way to the bottom of the table and page to scroll right.
Is it possible to make the scrollbar always appear fixed on the bottom of the page?
561
To show the scrollbars always on the webpage, use overflow: scroll Property. It will add both horizontal and vertical scrollbars to the webpage. To add only horizontal scrollbar use overflow-x: scroll property and for vertical scrollbar use overflow-y: scroll property.
use css position top keep it at the bottom {position : relative; bottom:0;} . Remove the css property once the user has scroll.
The easy fix is to use width: 100% instead. Percentages don't include the width of the scrollbar, so will automatically fit. If you can't do that, or you're setting the width on another element, add overflow-x: hidden or overflow: hidden to the surrounding element to prevent the scrollbar.
To hide the horizontal scrollbar and prevent horizontal scrolling, use overflow-x: hidden: HTML.
Set a fixed height (and don't use inline-styles):
Your altered Demo
the code:
.top{
height:10%;
}
.center{
overflow:scroll;
height:80%;
}
.bottom{
height:10%;
}
If you really want to have the scrollbars at the very bottom of your page, you could check this answer on how to achieve this without needing custom scrollbars and such stuff.
177
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
