Twitter Bootstrap: Sélectionnez l'élément dans la barre de navigation
Je suis d'avoir des problèmes avec <select>
éléments de doublure dans un bootstrap de la barre de navigation. Je veux que le texte de "la Recherche pour" tout le chemin vers le "Go!" pour être alignés verticalement. Il semble que si le bouton de sélection et les éléments sont de la même hauteur, je tiens donc à être aligné sur le haut et le bas.
Voici le code:
<div class="navbar navbar-fixed-top">
<div class="navbar-inner">
<div class="container">
<a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</a>
<a class="brand" href="#">Project</a>
<div class="nav-collapse collapse">
<ul class="nav">
<li class="active"><a href="#"><i class="icon-home"></i> Home</a></li>
</ul>
<form class="navbar-search pull-right">
<div>Search for
<select class="span2">
<option>Things</option>
</select> in
<select class="span2">
<option>City, NY</option>
</select>
<button type="button" class="btn btn-primary">Go!</button>
</div>
</form>
</div><!--/.nav-collapse -->
</div>
</div>
</div>
Voici un jsFiddle avec un exemple. http://jsfiddle.net/jefe317/EjS6f/2/
À la fois Firefox et Chrome montrent des résultats similaires
OriginalL'auteur Jeff Lange | 2012-11-16
Vous devez vous connecter pour publier un commentaire.
Rohit réponse du genre de travaux, mais peut laisser le texte au centre de l'écran un peu. Vous pouvez également supprimer la marge en bas à partir de la sélection:
Qui devrait même tout.
http://jsfiddle.net/EjS6f/5/
OriginalL'auteur David Fritsch
Démo
Hi @Jeff Lange Maintenant définir votre bouton
margin-top:0;
et ajouter àvertical-align:top;
Comme ce
Démo
OriginalL'auteur Rohit Azad
J'ai eu un problème similaire mais je l'ai fixée avec:
OriginalL'auteur WarrenV