CSS sur la table ne fonctionne pas

J'ai ce tableau HTML:

<table width="1100" border="1" style="text-align:center;" class="invoice">

<tr><td>&nbsp;</td><td>&nbsp;</td><td>Amount Due</td><td>Amount Enc.</td></tr>
<tr><td>&nbsp;</td><td>&nbsp;</td><td>CAD <?php echo $key['remainingbalance']; ?></td><td>&nbsp;</td></tr>

</table>

avec ce CSS:

table.invoice, th.invoice, td.invoice{
    border: 1px solid black;
}

cependant, il n'est pas le style de ma table, je m'attends à ce que toutes les frontières de la table, td et tr pour être 1px solid black, pourquoi ça ne marche pas?

  • Les cellules n'ont pas la classe de .invoice.
InformationsquelleAutor user979331 | 2012-04-20
  1. 4

    La frontière dans votre échantillon seulement appliquer à la table.
    1) le tableau.facture), il fait référence à une table avec la classe "facture"

    2) th.facture), il s'agit d'un en-tête de la cellule avec la classe "facture"

    3) td.facture), il fait référence à une table normale des cellules avec la classe "facture"

    donc 2 & 3 ne s'appliquent pas, parce que vous n'avez pas de classe sur votre table de cellules.

    Vous pouvez modifier les styles de ce genre:

    table.invoice, .invoice th, .invoice td{
    border: 1px solid black;
}
table.invoice{border-collapse:collapse;} /* update following asker's comment */

    ... puis la frontière s'appliquent à la tête de la cellule et la cellule normale.

    • Cela fonctionne 🙂 maintenant, est-il loin pour obtenir une seule ligne et non double bordée?
    • ajouter: table{border-collapse:collapse; } (si je vous comprends bien)
    • ouais c'est exactement ce dont je parlais, merci Faust
    InformationsquelleAutor Faust