What are the pros and cons with an overflowing horizontal scrollable nav bar?

1. What is horizontal scroll bar?
2. Why is there a horizontal scrollbar on my website?
3. How do I make my overflow scroll horizontally?
4. How to avoid horizontal scroll on mobile web with responsive web design?

What is horizontal scroll bar?

A horizontal scroll bar enables the user to scroll the content of a window to the left or right. A vertical scroll bar enables the user to scroll the content up or down.

Why is there a horizontal scrollbar on my website?

The horizontal scrollbar appears when the width of your site's content exceeds the width of the browser window.

How do I make my overflow scroll horizontally?

To enable horizontal scrolling, we can use the CSS property overflow-x. If we assign the value scroll to the overflow-x property of the container element, the browser will hide horizontally overflowing content and make it accessible via horizontal scrolling.

How to avoid horizontal scroll on mobile web with responsive web design?

Check all the paddings. If you add padding to something with width set to 100% it will go outside the parent. Also, use a CSS Reset. Although the fact that something is overflowing indicates an error in your responsive design and you should try and fix it instead to prevent something not being visible to a mobile user.