28172 sujets

CSS et mise en forme, CSS3

Bonjour,

J'aimerais modifier le CSS du tableau suivant: http://www.red-team-design.com/wp-content/uploads/2010/12/feature-table.html

Pour être plus précis, je voudrais supprimer les bordures (la blanche et la grise) situées sous la dernière ligne du tableau (la ligne correspondant à "user registration"), et ce, sur toutes les colonnes; puisque dans mon cas le footer du tableau est vide de texte.

Vous trouverez le code ici: http://www.red-team-design.com/feature-table-design-with-css3

J'ai essayé plusieurs modifications mais en vain. Pourriez-vous me donner un coup de main svp?

Merci.
salut,
je ne veux pas être méchant ni désagréable mais en récupérant un bout de code pour demander à ce qu'on le modifie, on apprendra jamais. Y'a pas de mal à débuter et autant faire bien les choses en les refaisant soi-même pour mieux apprendre.
Bon je ne veux pas jouer les sages...
La mise en page du tableau se fait en CSS3 donc les vieux navigateurs, malheureusement encore d'actualité, ne les interpréteront pas.

tr:nth-child(4) td {border-bottom:none;box-shadow:none}
Merci pour tes conseils Zelasan. Bien sur si j'ai sollicité votre aide c'est que j'ai essayé de me débrouiller tout seul avant. Seulement les tableaux c'est pas si facile que ça pour un débutant.

Maintenant je suis confronté à un autre problème. J'ai plusieurs tableaux qui utilisent la même classe mais qui ne possèdent pas le même nombre de lignes. J'ai donc voulu remplacer

tr:nth-child(4) td {border-bottom:none;box-shadow:none}

par

tr:last-child td {border-bottom:none;box-shadow:none}


Et cela me supprime la bordure inférieur du header également. Pourquoi, et comment y remédier?

Merci.
Administrateur
AbouKH a écrit :

tr:last-child td {border-bottom:none;box-shadow:none}


Et cela me supprime la bordure inférieur du header également. Pourquoi, et comment y remédier?
.

Parce que ton header est composé d'un <thead> dont le seul enfant (également :last) est un <tr>.

Tu peux cibler les lignes uniquement dans <tbody> par exemple :
tbody tr:nth-child(4) td {border-bottom:none;box-shadow:none}
J'ai ajouté :

tbody tr:last-child td {border-bottom:none;box-shadow:none;}


et cela me supprime la bordure inférieure de la dernière ligne du body de tous mes tableaux, quelque soit leurs nombre de lignes.

Merci pour vos conseils.