CSS : comment créer un espace entre les lignes d'un tableau ?

Question

Cela signifie que le tableau résultant ressemble moins à ceci :

[== =LIGNE== =] [== =LIGNE===] [===LIGNE===] [===LIGNE===]

... et plus comme ça :

[===LIGNE===]

[===LIGNE===]

[===LIGNE===]

[===LIGNE===]

J'ai essayé d'ajouter

margin-bottom:1em;

td et B, mais ils n'ont rien.

Answer 1

Tout ce dont vous avez besoin :

table {
    border-collapse: separate;
    border-spacing: 0 1em;
}

Cela suppose que vous voulez un écart vertical de 1em, et pas d'écart horizontal. Si vous faites cela, vous devriez probablement aussi envisager de contrôler votre hauteur de ligne.

Un peu bizarre que certaines des réponses que les gens ont données impliquent border-collapse: collapse, dont l'effet est exactement le contraire de ce que la question demandait.

Answer 2

table {
    border-collapse: collapse;
}

td {
    padding-top: .5em;
    padding-bottom: .5em;
}

Les cellules ne réagiront à rien à moins que vous ayez d'abord défini l'effondrement de la frontière. Vous pouvez également ajouter des bordures aux éléments TR une fois que cela est défini (entre autres choses.)

Si c'est pour la mise en page, je passerais à l'utilisation de div et de techniques de mise en page plus à jour, mais s'il s'agit de données tabulaires, assommez-vous. Je fais toujours un usage intensif des tableaux dans mes applications web pour les données.

Answer 3

Si aucune des autres réponses n'est satisfaisante, vous pouvez toujours créer une ligne vide et la styliser avec CSS de manière appropriée pour être transparent.