28172 sujets

CSS et mise en forme, CSS3

Bonjour,

Je constate que sous FF, les border-radius ne s'appliquent pas aux td et th alors qu'ils s'appliquent aux table

Par contre, sous IE et Chrome, pas de souci

Existe t il un moyen de contournement ?

Merci par avance
Edit: Essaie cela



table tr:last-child td:first-child {
    -moz-border-radius-bottomleft:10px;
    -webkit-border-bottom-left-radius:10px;
    border-bottom-left-radius:10px
}

table tr:last-child td:last-child {
    -moz-border-radius-bottomright:10px;
    -webkit-border-bottom-right-radius:10px;
    border-bottom-right-radius:10px
}




Modifié par jmlapam (05 Jul 2012 - 21:33)
Alors quelques précisions peut être

Lorsque j'applique le border-radius à l'ensemble du tableau, tout se passe correctement.

Seulement, ma première ligne (que je la mette en tr td ou thead) a une couleur de fond (background-color)

Du coup, cette couleur de fond casse l'arrondi haut et me met des coins carrés en haut.

Je cherche donc à appliquer un border-radius soit à la première ligne, soit aux deux cellules gauche et droite de la première ligne.
Dans tous les cas, seul FF ne prend pas en compte alors que pour le bas, aucun souci.

J'ai bien sur essayé avec border-radius et -moz-border-radius...

Encore merci à ceux qui se penchent sur mon problème
Oui oui, bien sur

Sauf que j'ai utilisé des tr:first-child car c'est la ligne du haut (celle qui est de couleur différente) qui me pose probleme

Sur une page de test, en dehors de mon projet, j'ai réussi à obtenir le résultat voulu:
J'ai appliqué les couleurs de fond aux td et non pas au tr

Ce code fonctionne donc:

td {
    background-color:#00F;
    padding: 0.5em;
}

tr:first-child td { background-color: #F00;}
tr:first-child td:first-child { border-radius: 8px 0 0 0; }
tr:first-child td:last-child { border-radius: 0 8px 0 0; }
tr:last-child td:first-child { border-radius: 0 0 0 8px; }
tr:last-child td:last-child { border-radius: 0 0 8px 0;}



Je vais donc introduire cette technique dans mon projet

Conclusion: Ne pas appliquer de background-color sur une ligne entière

Merci pour ton aide