Menu
When you go to page on my website where there is extra content, the scrollbar appears on the right, but it has a notiable shift to the left for my content. You notice this by clicking home and then hosting and back again on my site (www.ipalaces.org)
How can I account for the browser scrollbar on my pages? Can I make it so the scrollbar is always visible atleast?
My website is www.ipalaces.org, please let me know.
547
Scrollbar Selectors For webkit browsers, you can use the following pseudo elements to customize the browser's scrollbar: ::-webkit-scrollbar the scrollbar. ::-webkit-scrollbar-button the buttons on the scrollbar (arrows pointing upwards and downwards). ::-webkit-scrollbar-thumb the draggable scrolling handle.
Left-click and drag the small circle on the Scrollbar thumb color palette to select a color there. You can also choose different shades for your selected color by dragging the HSV bar sliders up and down. Drag the circle within the Scrollbar track color palette to choose a color for the track bar.
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.
Well, it depends on the browser.
body {
overflow-y: scroll;
overflow-x: scroll;
overflow: -moz-scrollbars-vertical;
}
Should force the horizontal (overflow-x) and vertical scrollbars (overflow-y) to be displayed. Though I recall that Opera sometimes fails to respect the declaration, unless it's on an element within the <body> (divs and the like).
Edited with regard to @wsanville's, and @BHare's, comment.
186
I've tested this on IE6, IE7, IE8, Firefox 3, and Chrome, and the simple way to have a vertical scroll bar always visible is simply:
html { overflow-y: scroll; }
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
