Un menu en gras dans la navbar
Résolu
lamontange
Messages postés
130
Date d'inscription
Statut
Membre
Dernière intervention
-
lamontange Messages postés 130 Date d'inscription Statut Membre Dernière intervention -
lamontange Messages postés 130 Date d'inscription Statut Membre Dernière intervention -
Bonjour,
Un souci que j'ai depuis pas mal de temps, j'ai le "news" de ma navbar qui est en gras, et désaligné me semble t'il.
Je n'ai pas réussi à trouver d'où ça venait :/
Voici le html :
<div id="navbarTop" class="collapse navbar-collapse justify-content-end p-1 m-0"> <ul class="nav navbar-nav px-3"> <li class="nav-item"> <a class="btn btn-primarybis" data-bs-toggle="modal" data-bs-target="#my-modal">NEWS</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section1">INTRO</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section2">SITES</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section3">STYLE</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section4">VIDEOS</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section5">PHOTOS</a> </li> <li class="nav-item"> <a class="scrollTo" href="#section6">ME</a> </li> </ul> </div>
et les CSS
#menutop nav .navbar-nav {
margin:0 10px 0 0 !important;
padding:0 !important;
font-size: 0.8em;
}
#menutop nav .navbar-nav a {
display: block;
color: white;
padding: 10px 6px 10px 0;
line-height: 1.3em !important;
font-family: 'Raleway', sans-serif;
text-align:right;
font-size: 1.1em;
}
#menutop nav .navbar-nav a:hover {
color: white;
filter: brightness(1.75);
}
nav li {
display: inline-block;
overflow:hidden;
vertical-align: middle;
}
nav ul li:last-child {
margin-right:0;
}
nav li a{
display:block;
padding: 8px 0;
position:relative;
font-size:1em;
transition:font-size 0.2s;
}
nav li a::before {
content:"";
width:0;
height:2px;
background: white;
position:absolute;
bottom:0;
left:50%;
right:0;
transition:all 0.2s;
}
nav li a:hover::before {
min-width:100%;
left:0;
}

avec une capture d'écran pour bien voir le problème.
Merci à vous.
Bonne journée,
LM
Macintosh / Chrome 104.0.0.0
A voir également:
- Un menu en gras dans la navbar
- Ecrire en gras sur whatsapp - Guide
- Menu déroulant excel - Guide
- Canon quick menu - Télécharger - Utilitaires
- Excel menu déroulant en cascade - Guide
- Windows 11 menu contextuel classique - Guide
2 réponses
Bonjour,
La mise en gras de l'élément NEWS ne semble pas provenir de ce css, il y a p-e d'autre code css qui est appliqué sur cet élément (voir notamment le code css pour les classes .btn et .btn-primarybis).
Essaye d'utiliser l'Inspecteur d'élément dans les outils de développement de ton navigateur pour trouver le code css appliqué sur cet élément.