Signaler

Style tableau CSS chaque case une couleur [Résolu]

Posez votre question flo39400 520Messages postés mardi 8 avril 2008Date d'inscription 20 septembre 2017 Dernière intervention - Dernière réponse le 20 sept. 2017 à 22:27 par flo39400
Bonjour,
J'aimerai savoir comment personnaliser un tableau ou l'on peu pas mettre de id ou de class au niveau des td et tr.

Merci d'avance de votre réponse.


Utile
+0
plus moins
Bonjour,

Pour commencer.. j'ai déplacé ta question dans le "bon" forum : css.

Ensuite.... as tu moyen d'identifier le tableau lui même (via une class ou un id ) ou peut-être via son conteneur (si il est dans une div (avec id ou class) particulière par exemple .. ?

Si oui.. il te suffit de jouer avec les enfants (descendants) / Frères ....
=> regarde les "selecteurs" CSS.Tu vas trouver sans mal ta réponse.

Par exemple :https://code.tutsplus.com/fr/tutorials/the-30-css-selectors-you-must-memorize--net-16048


flo39400 520Messages postés mardi 8 avril 2008Date d'inscription 20 septembre 2017 Dernière intervention - 19 sept. 2017 à 20:27
Merci de ta réponse, par exemple la j'ai un menu que j'ai défini en 100% sur les serveurs test tous ce passe bien, mais sur le serveur en ligne j'ai pas les 100%, cela fait que j'ai du blanc en haut voici le code :

body{
  font-family: 'Montserrat', sans-serif;
}
.btn-navigation{
 position: absolute;
 right: 30px;
 top: 30px;
 z-index: 20;
 cursor: pointer;
}
.btn-navigation .barre{
 width: 30px;
 height: 3px;
 margin-top: 3px;
 background: #111;
 transition: background .3s ease-in-out;
}
.btn-navigation .barre.white{
 background: #fff;
}
.navigation{
 position: fixed;
 right: 0;
 padding: 0 30px;
 background: #333;
 width: 20%;
 min-height: 100vh;
 transform: translateX(100%);
 transition: transform .6s ease-in-out;
}
.navigation.isOpen{
 transform: translateX(0%);
}
.navigation ul{
 list-style: none;
 position: absolute;
 top: 20%;
 transform: translateY(-50%);
 
}
.navigation ul li{
 margin: 10px 0;
 
}
.navigation ul li a{
 color: #fff;
 text-transform: uppercase;
 margin: 20px 0;
 text-decoration: none;
 letter-spacing: .070em;
 font-weight: 800;
 
}


code du menu:

<div class="btn-navigation">
 <div class="barre"></div>
 <div class="barre"></div>
 <div class="barre"></div>
</div>
<div class="navigation">
 <ul>
  <li>
   <a href="index.php" rel="nofollow noopener noreferrer" target="_blank">Home</a>
  </li>
  <li>
   <a href="index.php?inscription=1" rel="nofollow noopener noreferrer" target="_blank">Inscription</a>
  </li>
  <li>
   <a href="index.php?connection=1" rel="nofollow noopener noreferrer" target="_blank">Connection</a>
  </li>
  <li>
   <a href="#" rel="nofollow noopener noreferrer" target="_blank">News</a>
  </li>
  <li>
   <a href="#" rel="nofollow noopener noreferrer" target="_blank">Contact</a>
  </li>
 </ul>
</div>
<script src="js/jQuery.js"></script>
<script src="js/menu.js"></script>



Merci d'avance de votre réponse.

PS: le site de test si vous voulez aller voir : http://informatique-25.craym.eu
Répondre
Donnez votre avis
Utile
+0
plus moins
J'ai trouvé juste ajouter

body
{
 margin: 0;
}
Donnez votre avis

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !