Centrare il logo nella navbar di Bootstrap 4
Su un piccolo progetto sto usando la navbar di Bootstrap 4 solo per visualizzare il logo e richiamare il colore di un sito affiliato.
Di default tutti gli esempi che troviamo nel sito mettono il logo a sinistra.
Oggi vediamo come impostarlo al centro; tenete presente che noi stiamo mettendo il logo, ma vale per qualsiasi cosa:
<header>
<nav class="navbar navbar-expand-md navbar-dark fixed-top">
<div class="container">
<button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse"
aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">
<span class="navbar-toggler-icon"></span>
</button>
<div class="collapse navbar-collapse" id="navbarCollapse">
<ul class="navbar-nav mx-auto">
<li class="nav-item active">
<a class="nav-link" href="https://www.vfraviation.it/abbonamenti/">
<img src="assets/logo.webp" alt="VFR Aviation" height="40">
</a>
</li>
</ul>
</div>
</div>
</nav>
</header>
Il gioco sta tutto nel dare la classe mx-auto alla lista, e dentro metterci il logo.
Enjoy!
html bootstrap navbar
Commentami!