Scroll

Solve multiple scroll bar on one page

Solve multiple scroll bar on one page
  1. How do you handle multiple scroll bars?
  2. How do I get rid of the extra scroll bar?
  3. Why do I have two scroll bars?

How do you handle multiple scroll bars?

You can make any container scrollable with overflow: scroll or overflow-y: scroll . The general approach is to fix the height of these containers so they scroll. E.g. To split the scrolling views into multiple containers you would make e.g. a grid layout like normal and put a nested scrolling div inside.

How do I get rid of the extra scroll bar?

You can first try selecting the scroll bar by using a right click and then once selected you can press delete but you may need to first put the sheet into 'Design Mode' (see the option under the Developer menu in the above image). Once in Design mode you should be able to select the scroll bar and hit delete.

Why do I have two scroll bars?

You're basically getting a double scrollbar because your giving the body min-height of 100vh AND setting an overflow. It appears this was done to keep the menu in the correct position on mobile devices. That fixed things in Chrome, I assume other browsers as well but I didn't do any heavy testing.

Designig a website for academic scholar audiences
How do I create a scientific website? How do I create a scientific website?Simple logical structure Keep your site easy to navigate and do not creat...
Compact search bar design on top navigation bar for multiple pages?
What is super navigation?What is top navigation bar? What is super navigation?Super navigation is built to work with Entries, Categories and custom ...
Card sorting exercise for a complex platform that is more focused on actions than information
What is a card sorting exercise?Is card sorting Qualitative or quantitative? What is a card sorting exercise?Card sorting is a method used to help d...