Display:inline ne fonctionne pas

Résolu/Fermé
Lecodeurhtmlcss Messages postés 76 Date d'inscription lundi 20 avril 2020 Statut Membre Dernière intervention 24 août 2022 - 20 avril 2020 à 17:37
Lecodeurhtmlcss Messages postés 76 Date d'inscription lundi 20 avril 2020 Statut Membre Dernière intervention 24 août 2022 - 21 avril 2020 à 15:25
Bonjour,Je suis en train de programmer un site html / css . Tout fonctionne très bien… sauf un menu déroulant qui ne se décide pas à se mettre en ligne. Ca fait 4 ou 5 bonnes heures que je cherche une réponse au problème.
Voici mon code html:

	<body>
		<span>
			<ul style="display:inline">
				<li><a class="active" href="http://www.barparks.com/page_acceuil">Accueil</a></li>
				<li><a href="http://www.barparks.com/qui-nous_sommes">Qui sommes-nous ?</a></li>
				<li><a href="http://www.barparks.com/commander">Commander</a></li>
				<li><a href="http://www.barparks.com/photos">Photos</a></li>
				<li><a href="http://www.barparks.com/commantaires">Commentaires</a></li>
				<li><a href="http://www.barparks.com/contact">Contact</a></li>
			</ul>
		</span>


(il est plus long, mais j'ai mis ce qui compte)

et mon code css :

ul {
	
	border: 1px solid #555;
    list-style-type: none;
    margin: 10;
    padding: 10;
    width: 10px;
    background-color: #f1f1f1;
}

li a {
	display:inline-block;
	width: 100px;
	display: inline-block;
    color: #000;
    padding: 8px 0 8px 16px;
    text-decoration: none;
}

li a.active {
    display: inline-block;
	background-color: #4CAF50;
    color: white;
}

li a:hover:not(.active) {
	display: inline-block;
	background-color: #555;
    color: white;
}

.loading-dd-options {
    display: inline;
}


Je tiens à dire que ça a marché un moment, mais que le fichier css a été supprimé, et que entre temps j'ai modifié mon html. C'est donc possible !

Si ça peut aider, j'ai pris une capture de l'inspecteur de chrome sur cette page :

Enfin, J'ai regardé TOUT les sites possibles et imaginables fournissant une réponse à cette question, mais sans résultat. Si vous réussissez, vous êtes très forts !

Merci beaucoup d'avance !

1 réponse

jordane45 Messages postés 38346 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 16 décembre 2024 4 717
Modifié le 20 avril 2020 à 19:01
ul {
    display:inline;
    border: 1px solid #555;
    list-style-type: none;
    margin: 10;
    padding: 10;
    width: 10px;
    background-color: #f1f1f1;
}

li {
  display:inline;
}


1
Lecodeurhtmlcss Messages postés 76 Date d'inscription lundi 20 avril 2020 Statut Membre Dernière intervention 24 août 2022 1
21 avril 2020 à 15:25
Merci beaucoup ! Donc il faut mettre display:inline pour "ul' et 'li' aussi !
0