Untitled UI logotext
Solutions
WebsitesEcommerceMobile AppsWeb AppsProduction Support & Maintenance
Our work
Company
About usBlogPodcastContact us
Book a free consultation

How to always show an inline scroll bar on Mac

Olivia Rhye

Inline scrolling, while being a bit finicky, is sometimes necessary. It can be great for blogs, news feeds, or any other content with a variable height. However, if there is a lot of content, things can get cut off due to a maximum container height. This results in elements sitting "below the fold", or if things line up correctly it may not even be obvious that there is more content to scroll. This is especially an issue on Macs, which auto hide scroll bars unless you are scrolling them. This is a system-wide setting and cannot be overridden via CSS. Therefore, a solution is needed. Pseudo-elements to the rescue!

If you have scrolling content like this, here's a quick fix.

On your parent container (in this case, we will call it .hide-scrollbar simply put these rules (to set up inline scrolling)

.hide-scrollbar{

Ready to start a project?

Book a free consultation
Untitled UI logotext
Our work
About us
Blog
Careers
Submit a ticket
Agency Partnerships
Contact
© 2024 fjorge. All rights reserved.
Privacy