2017-08-20 1 views
-1

J'ai la barre de navigation suivant, ainsi que d'une image de celui-ci:Aligner les éléments du logo et de la barre de navigation?

<nav class="navbar navbar-default"> 
    <div class="container"> 
     <div class="navbar-header"> 
      <a class="navbar-left" href="#"><img id ="logo" src="{% static 'core/images/logo_footer.png' %}"></a> 
     </div> 
     <ul class="nav navbar-nav navbar-right"> 
      <li><a href="{% url 'index' %}">Home</a></li> 
      <li><a href="{% url 'repairs_and_upgrades' %}">Repairs/Upgrades</a></li> 
      <li><a href="{% url 'remote_backups' %}">Remote Backups</a></li> 
      <li><a href="{% url 'networking' %}">Networking</a></li> 
      <li><a href="{% url 'data_recovery' %}">Data Recovery</a></li> 
      <li><a href="{% url 'contact' %}">Contact Us</a></li> 
     </ul> 
    </div> 
</nav> 

css:

#logo { 
    height: auto; 
    width: auto; 
    max-height: 75px; 
    max-width: 250px; 
} 

Bootstrap navbar

Comment puis-je faire en sorte que les éléments de liste (Accueil, Réparations/Mises à niveau, etc.) s'alignent avec le logo?

+0

partage de la CSS, vous avez à ce jour est utile. Plus: qu'avez-vous fait jusqu'ici pour résoudre ce problème? – meavo

+0

Bon conseil, @meavo, j'ai mis à jour la question –

Répondre

0

vous pouvez modifier la balise liste css

.li{ 
margin-top:5%; 
}