Last Updated on
- 1 Scroll Bar
- 2 Frequently Asked Questions
- 2.1 Why do horizontal scroll bars appear on certain websites?
- 2.2 Why would a horizontal scroll bar appear even though there isn’t any content that doesn’t fit on the screen?
- 2.3 What keyboard commands can I use to navigate a webpage instead of using the scroll bars?
- 2.4 The scroll bar in my browser keeps disappearing. How do I get it to stay put?
- 3 Glossary Index
A scroll bar is a control element used to view portions of a program or website which do not fit within the application window or computer display.
When you visit a website and have to move the browser window vertically to see more content, the vertical bar on the side of the browser that you use to navigate up and down is a scroll bar. Scroll bars may be either vertically oriented, allowing you to move the viewport up and down, or horizontally oriented, allowing you to move the viewport from side to side.
Frequently Asked Questions
Why do horizontal scroll bars appear on certain websites?
You may have noticed that on some websites a horizontal scroll bar appears, and you have to scroll back and forth to view all of the contents of the website. This is particularly common if you’re using a small laptop, tablet, or smartphone. This happens when a website developer has not included styling rules to resize the website based on the size of the viewport of your device – a practice called responsive web design. By today’s standards, all websites should employ responsive web design principles. However, some older sites, as well as sites and web applications intended strictly for use with a large screen, have not implemented responsive web design principles.
Why would a horizontal scroll bar appear even though there isn’t any content that doesn’t fit on the screen?
From time to time you may notice a horizontal scroll bar when viewing certain websites. However, when you use the scroll bar you find that there is no content in the hidden portion of the page. If you’ve ever seen this happen, it’s likely that there is a problem with the styling rules applied to the website. This type of issue is commonly caused when a child element is set to the full width of the viewport while the parent element has additional padding or margins applied between the child and parent element. As a result, the parent element swells to a size larger than the viewport.
In any event, the issue is most likely simply a styling issue, and not something you need to be concerned about – unless your website is the site where you’ve seen this type of behavior, in which case, it’s time to get in touch with your website developer.
If you prefer to use keyboard buttons to navigate a webpage, the most common keys to use include:
- The directional arrows: Scroll one step in the direction pressed.
- Home: Scroll all the way to the top of the page.
- End: Scroll all the way to the bottom of the page.
- Page Up: Scroll up by one viewport.
- Page Down: Scroll down by one viewport.
The scroll bar in my browser keeps disappearing. How do I get it to stay put?
Some browsers, most notably Internet Explorer 11, feature a scroll bar which will disappear after a few seconds if the webpage viewport stops moving. To cause the scroll bar to reappear, move your mouse over the area where the scroll bar should be. If your mouse is already in this area, you may need to move it away and then back over the scroll bar area to cause the scroll bar to reappear.
In some browsers it is possible to stop this behavior by navigating to the advanced browser settings. In other browsers, there is no way to prevent this behavior, and your only option is to switch to a different browser if you find the behavior to be something you just can’t get used to.