Overflow: auto alternative for a long horizontal menu?

enter image description here

I have a little dilemma on my hands. I have a horizontal category link nav bar at the top of a page on my site with radio buttons to choose the links from. The problem is that there are a too many links in it and they are all needed so I can’t remove them.

As an alternative to having "missing links" out of view, I’ve added an overflow auto property which solves my problem, but adds the horizontal scrollbar (under the nav) to see the out of view links. I don’t like that view. Example of something that came to mind was hide scrollbars, and when I click a radio button and use the arrows to scroll across to the out of view links, could the links move into view as I scroll with the arrow keys so the scroll bar underneath is not shown?

Is there a way I can make the category link navbar work without a scrollbar using overflow property for desktop viewers?

Note: This website is in mobile view up to 1200px wide due to this navbar. I need it, can’t be removed, and I don’t have another idea how to change it.

If I am not mistaken, I believe (since I didn’t make this overflow: auto change yet, only in the inspector) that on mobile devices (phone/tablet) the scrollbars won’t be shown, and I can just swipe the menu and that would work out fine, but what about when I view on my desktop, what alternative is there to get rid of the horizontal scrollbar under the category link navbar?

Brian

Asked on July 16, 2020 in CSS.
Add Comment
0 Answer(s)

Your Answer

By posting your answer, you agree to the privacy policy and terms of service.