[Résolu] [Amateur] tableau avec et sans bordure

Bonjour,
Je souhaite réaliser un tableau dans lequel je dois supprimer certaines bordures.
J'y suis presque arrivé, mais il reste la 7eme colonne et la case en haut à gauche que je voudrais voir apparaître sans bords, mais je n'arrive pas à les supprimer.

Dans le code je mets des class="sansbord" mais cela ne marche pas.
Quelqu'un aurait une idée?

Merci d'avance


HTML:

<table class="bord">	 
<tr class="sansbord">
<th ></th>	
<th colspan="5"><strong>Analyse chimique</strong></th>
<th ></th>											
<th colspan="2"><strong>Dégustation</strong></th>
</tr>					
<tr class="horizontal" >
<th class="sansbord"></th>
<th>Acidité<br/> max <br/> (% acide <br/> oléique)</th>
<th>Indice<br/> de<br/> peroxyde<br/> (meq/Kg)</th>
<th>K232</th>
<th>K270</th>
<th>Teneur<br/> en cires<br/> (mg/Kg)</th>
<th class="sansbord"></th>
<th>Note<br/> fruité</th>
<th>Défaults</th>
</tr>
<tr class="vertical">
<th><strong>EXTRA VIERGE</strong></th>
<td><0,8</td>
<td ><20</td>
<td><0,01</td>
<td><0,22</td>
<td><150</td>
<td class="sansbord"></td>
<td>>0</td>
<td>0</td>
</tr>
<tr class="vertical">
<th><strong>VIERGE</strong></th>
<td><3,3</td>
<td ><20</td>
<td><0,01</td>
<td><0,30</td>
<td><250</td>
<td class="sansbord"></td>
<td>>0</td>
<td><6</td>
</tr>
<tr class="vertical">
<th><strong>LAMPANT</strong></th>
<td>>3,3</td>
<td >>20</td>
<td><0,016</td>
<td>>1,10</td>
<td>>350</td>
<td class="sansbord"></td>
<td></td>
<td>>6</td>
</tr>
<tr class="vertical">
<th><strong>RAFFINÉE</strong></th>
<td><1</td>
<td ><15</td>
<td>>0,016</td>
<td><1,10</td>
<td><350</td>
<td class="sansbord"></td>
<td>>0</td>
<td><6</td>
</tr>
</table>

CSS:

table {display: block; position:relative; margin: 0 auto; border-collapse: collapse; }
td, th  { padding: 5px;}
td{text-align: center;}
.vertical th{text-align: left; font-size:1.2em}
.horizontal th{text-align: center; font-size:1em}
.bord td, .bord th{border: 1px solid black;}
.sansbord, .sansbord td, .sansbord th,.bord table, .bord tr {border:0;}

Hello,

Ton sélecteur ".bord td" est plus important que la simple classe ".sansbord". Tu peux voir une explication sur cet article : http://blog.organicweb.fr/comprendre-le-poids-des-regles-css.

Si tu rajoute la classe parent .bord .sansbord, .sansbord td, .sansbord th,.bord table, .bord tr {border:0;}, ça devrait fonctionner : http://codepen.io/anon/pen/Lzjxh

Par ailleurs, tu as mis un display block sur ta table

merci tominCat,

Liens très intéressant pour comprendre les priorités en fonction du type de balise, de l'ordre du code et des emboîtements parents/enfants.

La modif que tu m'as passée fonctionne à la perfection et grâce au tuto, j'ai compris pourquoi.
Définir un .bord .sansbord permet de s'ffranchir de la tyrannie du .bord!

"Donne un poisson à un homme, il se nourrira un jour. Apprends lui à pêcher, il se nourrira toute sa vie".
En parlant de poissons, requins et planctons...!

Ensuite, je ne connaissais pas Codepenpro.
C'est vraiment super-pratique pour coder et voir en direct ce que cela donne sans avoir à enregistrer et lire sur un navigateur pour vérifier.

Avec plaisir ^^