How can I make a Horizontal scrolling nav bar that also works with mobile

Question

So I have a website about the NBA and the problem is there is 30 teams in the NBA. When I make a nav bar it takes up half the page because there is 30 teams lol. How can I make a nav bar that scrolls horizontally to the right so just more teams keep popping up as your scroll. I also need it to work for mobile version so I need this nav bar to be responsive. Thank you very much.

Answer 1

To enable horizontal scrolling, you should add something like this in CSS:

.enableHorizScrolling {
  max-width : 10000px;
  overflow-x : auto;
}

max-width will instruct your element to keep adding team icons to the right, and overflow-x is for deciding if/when to show a scrollbar