Bootstrap navbar hauteur changé sur l'insertion de l'image de la marque

Je suis nouveau sur le HTML et le CSS et ont commencé à coder dans les 4 derniers jours. J'ai trouvé bootstrap très utile pour faire bouger les choses rapidement.

Voici ma tentative d'obtenir une barre de navigation avec la transparence et la fixe à la partie supérieure.

http://jsfiddle.net/revanur/mf5wc/4/

<!-- Top-Navigation-Bar -->
<div class="row-fluid">
<div class="navbar navbar-fixed-top">
<div class="navbar-inner" id="topbar">
<div class="container"> <a href="#"><img class = "brand" src="http://placehold.it/269x50" alt="SparkCharger" /></a>
<button id="topbtn" type="button" 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>
</button>
<div class="nav-collapse">
<ul class="nav pull-right">
<li class="active">
<form class="navbar-search brand">
<input type="text" class="search-query" placeholder="Search">
</form>
</li>
<li><a href="#"> <h5> Discover </h5></a>
</li>
<li><a href="#"> <h5> Blog </h5></a>
</li>
<li class="dropdown">   <a class="dropdown-toggle" data-toggle="dropdown" href="#"><h5>Start <span class="caret"></span></h5></a>
<ul class="dropdown-menu">
<li><a href="#"> <h6> Login </h6></a>
</li>
<li><a href="#"> <h6> Signup </h6></a>
</li>
</ul>
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
<!-- /Top-Navigation-Bar -->

Toutefois, la hauteur de la barre de navigation semble changer en fonction de l'image de marque de la taille. Je n'ai aucun problème avec ça, mais je remarque importante l'espacement entre l'image et la barre de navigation en haut et en bas. Comment puis-je changer cela. Aussi, est-il possible de fixer la barre de navigation de taille, de sorte que la barre de navigation ne pas avoir un esprit de ses propres.

  • Vous pouvez poster votre CSS s'il vous plaît?
  • Il n'y a pas de CSS définie par l'utilisateur ici. Voulez-vous que le post OP, pour l'ensemble de Bootstrap CSS?
  • Fait, ajouté CSS.
InformationsquelleAutor Ram | 2013-03-24
  1. 2

    Utiliser quelque chose comme ceci:

    .brand {height: 25px;}

    Démo: Violon

    • Grâce Praveen. Veuillez regarder l'image de rembourrage. Je ne veux pas réduire la taille de l'image. Je veux garder la même, mais de réduire la marge. jsfiddle.net/revanur/mf5wc/4
    • Pourquoi est-ce une réponse marquée comme étant la bonne solution quand @lflores réponse est la bonne?
    • Alors, êtes-vous essayer d'argumenter sur quelque chose qui est arrivé à deux ans et demi? Je suis d'accord que sa réponse est correcte. :)
    • Pas vraiment. Je viens de chercher pour un autre problème (lié à celui-ci) et l'a trouvé bizarre que la bonne réponse n'est pas marqué comme une.
    • Ouais, j'ai accepté. Même moi, je ne suis pas sûr dans quelles circonstances l'OP marqué ma réponse est correcte. :)
    InformationsquelleAutor Praveen Kumar Purushothaman
  2. 7

    Il y a quelques choses qui affectent la hauteur de la barre de navigation:

    1. div class="navbar-inner" (5px rembourrage)
    2. img class="marque" (10px rembourrage)
    3. la taille de l'image

    Vous pouvez retirer le rembourrage par: 

    img.brand {
padding: 0;
}

    Et/Ou vous pouvez spécifier la hauteur de la barre de navigation: 

    div.navbar-inner {
height: 10px;
}
    InformationsquelleAutor lflores