If you have a tiny computer screen, then you might always be wondering how you could get the maximum space on it. A scroll bar in Google Chrome already occupies a significant amount of space while browsing in Google Chrome. I am sure you might have thought of how you can get rid of it. Today we are going to see how to hide the scrollbar in Google Chrome while not in use?
Most of the laptops come with a smaller screen, and even if you have a larger working screen why would you need a scroll bar. Isn’t it?
I am sure the answer is yes, we all need a wider screen while working.
This is what we want to get rid of
Typically, the browsers are being designed in such a way that a user could scroll it through the mouse cursor from the right pane.
And that was done considering the earlier days computer mouses which use to have two buttons only. No middle mouse or scroll wheel at all.
Though people are habituated scrolling through that slider. So changes haven’t got placed into browsers as well.
But, Now every computer mice have a middle mouse key(scroll key). And most of the people use it while browsing.
In this case, we can definitely avoid that thicker Google Chrome overlay scrollbar.
Recently, I was on Quora, and found a query there, How would I remove or hide the scroll bars from Google Chrome?
As we can see in the below Image –
I have seen few replies to that, and those were – “Press F11 to view the Full screen” and the other one “install a third party extension”.
- But, what if someone wants to see the Browser top menu and Address bar as well? makes sense, isn’t it?
- Why do we need to add one more extension as we already have an inbuilt feature in Google Chrome already?
Chrome developers are aware of such things, and they have already had the solution as overlay scrollbars. But, they haven’t made it by default.
But, fortunately, we can activate it from the Google Chrome Experimental Features.
How to Hide the Scrollbar in Google Chrome
Step 1. Open a Google Chrome tab
Step 2. Paste type the below URL in the Google Chrome address bar
It will be taking you to the Chrome experimental features, Click in the drop down.
Step 3. By default it will be disabled (set as default), you need to enable it to hide the Scrollbar.
Step 4. Click on the Relaunch Now Button shows on the bottom of chrome browser.
Alternatively, you can also this method to restart Google Chrome to see the changes.
This will hide the scrollbar completely. when you scroll the page through the mouse wheel, you will see a thinner scroll bar with some amount of transparency.
Isn’t it cool?
And the best part is when you hover the mouse around the sidebar you would be able to see the scrollbar completely.
Say a BIG NO to that horizontal Scrollbar in chrome. And if you are interested in chrome extension method. Let me show you that too.
Hide Scrollbar using Chrome Extension and CSS
Yeah, if you are not sure and hesitant above the above method. Then you can also use a chrome extension to hide the scrollbar.
Step 1. Install Rescroller Chrome extension.
Step 2. In General section, by default the scrollbar size would be 8px, you can change it to 1px to reduce the scrollbar width.
If you want to completely remove the scrollbar then follow step 3.
Step 3. Scroll to the bottom Miscellaneous section
Step 4. Check Use Custom CSS, and add the below CSS.
This is how you can do it hide scollbar with CSS using a chrome extension.
So, you see the scrollbar only when want to use it, other than that it will completely be hidden and you will get an extended page to work.
Consider Sharing if this helps.