Sujet Précédent Sujet Suivant

Problème de code html/css

Fermé
Matprox - Modifié le 10 févr. 2020 à 11:55
 declique69 - 19 févr. 2020 à 08:56
Bonjour, j' ai un problème qui est que je souhaite mettre deux class dans une seule balise mais, dans mon code css, je ne sait pas comment faire.

Voilà mon code si vous voulez : 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Titre</title>
    <link rel="stylesheet" type="text/css" href="css/style.css">
    <style type="text/css">
    </style>
  </head>
  <body>
    <?php
      include'navbar.php'; 
     ?>
    <h1>Mon site!</h1>   
  </body>
</html>




<link rel="stylesheet" type="text/css" href="css/navbar.css">
<nav class="menu-nav">
   <ul>
     <li class="btn menu-acceuil">
      <a href="#">
       Acceuil
      </a>
     </li>
     
     <li class="btn">
      <a href="news.html">
       Actualités
      </a>
     </li>
     
     <li class="btn">
      <a href="contact.html">
       Contact
      </a>
     </li>
   </ul>
 </nav>

Pour info, c' est au "<li class="btn menu-acceuil">" que galère. 


h1.headline{
 color: black;
 font-size: 50px;
}

nav.menu-nav ul li.btn a{
 color: black;
 background-color: white;
 text-decoration: none;
}

nav.menu-nav ul li.btn{
 list-style-type: none;
 display: inline-block;
}

nav.menu-nav ul li.btn:hover a{
 color: grey;
 background-color: white;
 transition: 1.5s all;
}

li {
 font-size: 20pt;
 padding: 5px 20px;
}
A voir également:

5 réponses

Réponse 1 / 5
jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
10 févr. 2020 à 11:56
Bonjour,

1 - Ta question concernant le css ... je la déplace dans le forum CSS.

2 - En quoi mettre deux class dans un élément html te pose problème ?
Tu n'expliques pas ton souci.. tu dis juste que ça galère...
Hors..; à moins d'être devin.. il va nous être difficile de comprendre ton souci.
Donc, merci d'expliquer EXACTEMENT le problème constaté
1
Matprox
10 févr. 2020 à 12:01
Salut jordane en fait j ai lu qu' il fallait laisser un espace pour mettre deux classes mais c' est dans le code css que ça bloque:
j' ai fait:
.(classe) {
color: red;
}
J ai enregistré et actualisé ma page mais sa n' a rien changé
0
Réponse 2 / 5
jordane45 Messages postés 38138 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 17 avril 2024 4 649
Modifié le 10 févr. 2020 à 12:17
Donc tu veux cibler le li qui a les deux class 
btn menu-acceuil


Dans ce cas, 
li.btn.menu-acceuil{
 
}


Bien entendu, après toute modification de CSS (ou de JS ) il faut vider le cache de ton navigateur pour être sûr que les modifications sont prises en compte.

1
Réponse 3 / 5
Matprox
10 févr. 2020 à 12:05
Ce que je veux faire c est rendre indépendante chaques balises <li> pour pouvoir changer la taille , la police ... de chacunes.
0
Réponse 4 / 5
Matprox
10 févr. 2020 à 16:37
Très bien merci
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 5
declique69
Modifié le 19 févr. 2020 à 08:57
Le plus simple sera peut-être d'utiliser un sélecteur par numéro d'élément. Cela évitera de devoir associer une classe à chaque balise <li>

On peut écrire

li:nth-child(1) {... styles...}
li:nth-child(2) {... styles...}
Etc.

Voir le sélection nth-child :
http://stylescss.free.fr/v2-selectors/child.php
0

Discussions similaires

Code de renvoi d'appel : Ooredo, Mobilis...
midoou07 -
Camille -

13 réponses
Espace en HTML
baissaoui -
baissaoui -

0 réponse
Acces à snapchat temporairement désactivé
Anto_1234 -
M2 -

87 réponses
liste de noms par ordre alphabétique
alma -
alma13 -

23 réponses