PROJET AUTOBLOG


shaarli-Liens en vrac de sebsauvage

Site original : shaarli-Liens en vrac de sebsauvage

⇐ retour index

Gotcha CSS

jeudi 26 février 2015 à 14:33
Si vous vous demandez pourquoi votre cellule n'est pas entourée en bleu malgré votre CSS:

<style>
  .matable > tr > td { border: 2px solid blue; }
</style>
<table class="matable">
   <tr>
       <td>coucou</td>
   <tr>
</table>

C'est juste parce que vous avez oublié que le corps d'un tableau est implicitement contenu dans un <tbody>. Votre règle CSS doit donc être:

  .matable > tbody > tr > td { border: 2px solid blue; }

Et là ça marche.   ;-)

Pour ne pas vous faire avoir, inspectez l'élément avec les outils développeur Firefox: Vous verrez alors le code html tel que Firefox le voit (et qui peut être différent de celui de "Voir le source").

Pour résumer:
 - "Voir le source" = code html tel que renvoyée par le serveur (et donc avant parsing et exécution du javascript)
 - Inspecteur Firefox: arbre DOM tel que Firefox l'a en mémoire (et donc *après* exécution du javascript).
(Permalink)