CODEWITHSUNDEEP
csstwitter-bootstrap-3
Shafiq
Shafiq

Reputation: 105

Bootstrap Justified Nav Bar not collaspsing correctly

Building a site using bootstrap. The main navigation bar is set as justified (nav-justified) -

When it gets to medium, some of the text on the menu is wrapped below and not sure to why this is happening.

Any ideas?

Thanks!

Upvotes: 0

Views: 60

Answers (3)

Anandh Sp
Anandh Sp

Reputation: 787

@media only screen and (min-width: 768px) and (max-width: 991px) {
        #navbar a
         {
          font-size: 12px;
         }
  }

Try these css lines

Upvotes: 0

Bhupendra Piprava
Bhupendra Piprava

Reputation: 228

Hi you can do something like this to prevent wrapping

.nav > li > a {
   white-space: nowrap;
}

This will prevent to break words

Upvotes: 1

JBux
JBux

Reputation: 1394

Try reducing text size at the medium breakpoint:

@media only screen and (max-width: 992px) {
    #nav-bar {
        font-size: 0.75em;
    }
}

Or something of that sort, where #nav-bar is the ID of your nav bar (obviously...)

Upvotes: 0

Related Questions