CODEWITHSUNDEEP
twitter-bootstrap-3navbar
Sogl
Sogl

Reputation: 822

Bootstrap navbar right side falls under the left

Please look at the official navbar example: https://getbootstrap.com/examples/navbar/

If you try to resize your browser you see this: enter image description here

Today I found the same problem on my website.

How to easily fix this behavior?

Upvotes: 0

Views: 375

Answers (1)

Gleb Kemarsky
Gleb Kemarsky

Reputation: 10398

This menu has not enough space in one row. The right side part just does not fit in the same line. You can:

  1. reduce the number of menu items
    (for example, hide one of them by adding the hidden-sm class)
  2. make names of items shorter
  3. hide a word from the name:
    <li><a href="#">Something else<span class="hidden-sm"> here</span></a></li>
  4. reduce the distance between menu items
  5. reduce the width of the logo for this screen width
  6. expand the container or use container-fluid instead

Upvotes: 3

Related Questions