Coloré un tableau selon son contenu

Bonjour,

Je suis débutant en css et je recherche un moyen de colorer les cases de mon tableau si celui si est "plein" d'une couleur ou d'une autre couleur si la case est vide :

Par exemple

<table>
				   <tr>
				   	<td id="case_nul"></td>
				       <td>Personne 1</td>
				       <td>Personne 2</td>
				       <td>Personne 3</td>
				       <td>Personne 4</td>
				   </tr>
				   <tr>
				   	<td>Puissant</td>
				       <td></td>
				       <td></td>
				       <td class="plein">X</td>
				       <td></td>
				   </tr>
				   <tr>
				   	<td>Petit</td>
				    	<td></td>
				       <td class="plein">X</td>
				       <td></td>
				       <td></td>
				   </tr>
</table>

je veux que les cases avec une croix soient Bleu et ceux vides rouges.

Pour mon exercice, uniquement en CSS svp ..

Merci a vous et bonne journée
Modifié par 6l20 (28 Sep 2014 - 09:21)

Bonsoir,

La réponse simple est :

td:empty

Mais il y a deux choses à noter :
- :empty est reconnu par tous les navigateurs à partir d'IE9
- certaines de tes cellules ne sont pas des <td> mais sont des cellules d'entêtes (<th>), il vaudrait mieux les structurer comme telles
- dans ta première rangée, la toute première case est vide, elle sera donc également colorée en rouge puisque vide, et ça ne t'arrangera pas.

Le plus simple pour exclure la première rangée est :

tr + tr

Au final, le résultat se trouve ici : http://codepen.io/raphaelgoetter/pen/DxGjB

Bon week-end

Un grand merci a toi, c'est super cool de m'aider comme ca

Je testerai ca demain et te reposterai mon resultat .

Bonne soirée