Ugly Bootstrap horizontal scrollbar removal

What happened? You copied the grid structure from Bootstrap and now you have a funky horizontal scrollbar at the bottom of your site.

Here are some guides to help you along.

  1. Make sure you aren’t encasing a full-width carousel inside of a container.
    Carousels already have the proper container inside the item div.
  2. Don’t encase a standard Bootstrap menu inside a container unless you are doing a custom menu.
    In the Bootstrap site example, the container is inside the nav element.
  3. Make sure you are using the proper grid structure.
    You always have container > row > class and if nesting, container > row > class > row > class because nested classes need to be inside rows. The row offsets the container padding.

Hopefully these little tidbits will save you a lot of headaches down the road!

Notify of
Inline Feedbacks
View all comments