Come utilizzare nav-pillola con nav-giustificato da bootstrap3x senza reattivo caratteristiche

Question

Ho tanta voglia di implementare nel mio progetto :

<div class="container">
        <ul class="nav nav-pills nav-justified">
          <li class="active"><a href="#">Home</a></li>
          <li><a href="#">Projects</a></li>
          <li><a href="#">Services</a></li>
          <li><a href="#">Downloads</a></li>
          <li><a href="#">About</a></li>
          <li><a href="#">Contact</a></li>
      </div>
</div>

Tuttavia ho una domanda e a striscia la reattivo caratteristiche.Per essere più esatti - per evitare che il sopralzo quando lo schermo si rimpicciolisce.

Ieri ho trascorrere tutto il giorno alla ricerca di modi per rendere Bootstrap 3 non risponde.Ho provato a creare il mio file css personalizzato sovrascrivere le caratteristiche che vuoi, ma dal momento che ho appena iniziato a scavare nel CSS trovo molto difficile, e al momento non è possibile modificare manualmente tutto ciò che deve essere cambiato.Ho provato con il compilatore sul sito ufficiale e ha avuto un certo successo, ma ancora ci sono alcune reattivo a sinistra (come le classi utilizzate in una forma ancora stavano causando elementi di crollo).Poi ho provato bassjobsen lavoro da qui ed era molto vicino, ma alla fine quando ho parlato oggi con il mio capo abbiamo deciso di tagliare la fluidità troppo e bastone ad larghezza definita.Così torno sul sito ufficiale dove c'è una sezione che descrive come rimuovere la reattività che si può leggere qui ma il problema è che la suggestione e l'esempio fornito per questa proposta sono solo parziale soluzione.Per il mio nav-pills ancora un crollo dopo il raggiungimento di determinati larghezza.Ho scaricato e incluso il non-reattivo.css file che è stato negli esempi di progetto, quindi non è questo il problema.Per come la vedo io le cose, a modificare ogni classe manualmente e non c'è modo semplice per fare il bootstrap 3 solo per hi-res dispositivi (correggimi se sbaglio per favore).

Mi dispiace di non fornire più il codice, ho fatto molti tentativi ma non credo che potrebbe essere di alcun aiuto.Se qualcuno ha avuto lo stesso problema e ha una soluzione per questo sarà molto apprezzato.Ho intenzione di abbandonare il bootstrap e solo puro CSS/jQuery codice di cose, ma mi piace molto questa caratteristica e voglio aggiungere al mio progetto prima di continuare.

Answer 1

Ciao, in questo particolare menu, è possibile fare questo :

• Rimuovere la classe nav-justified questo rimuove il reattivo di stili.

• Due fanno il contenitore con il fisso width.

  .container {
    width:800px;
  }
  

Vista questa demo http://jsfiddle.net/52VtD/561/.

Infine, se si utilizza bootstrap solo per il tema visivo non credo sia il modo migliore.

Per mantenere gli stili di nav-justified è possibile tenere traccia di questo luogo e in altra classe:

.nav-pills li {
  float:none;
  display:table-cell;
  width:1%;
  text-align:center;
}

La demo http://jsfiddle.net/52VtD/566/

Modifica

La logica Qui -->

Rimuovere la classe nav-justified perché è l'ultimo che è di sovrascrivere gli stili sul ul e, probabilmente, è la chiamata di classe dal media queries.Quindi, la rimozione di questo consente di evitare i media query dichiarazione e non cambiare posizione o display reattivo.

E per mantenere il visual il nav-justified aggiungere alcuni stili e ho solo questi stili e mettere sopra l'altra dichiarazione di classe che non abbia il reattivo parte.

Se cercate qui http://getbootstrap.com/dist/css/bootstrap.css beh, lo si può trovare che classe sono chiamati dai media query dichiarazione.