Blog d'aide de Blog4ever

Blog d'aide de Blog4ever

Arrondir les angles d'un tableau dans un article

1899 appréciations
Hors-ligne
Bonjour, 
Si je sais arrondir les angles d'une image et, ou d'un bloc, je peine à le faire pour un tableau dans un article, 
J'ai tenté d'ajouter "border-radius+"14px;" dans le bloc html de mon article, Sans succès,
J'ai testé
table {
border-radius: 14px;
}

et

table {
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
border-radius: 20px;
}

dans mon css, Rien,

Je continue à chercher de mon côté, mais par avance, Merci pour l'aide qui me sera apportée,

786 appréciations
Hors-ligne
 @Mi Neth@

Essaye ceci :

th, td {
  border: 1px solid black;
  border-radius: 20px;
}

1899 appréciations
Hors-ligne
 kiamgo, 
Je n'avais pas vu ta réponse, Non, ça ne donne rien, même avec important, 
Mes articles sont rattachés à des catégories, je me demande si cela peut avoir un impact? 
Merci et bonne journée, 

786 appréciations
Hors-ligne
Dans ton HTML, vérifie "border-collapse". S'il est égal à "collapse", change et mets "separate".
Tu dois avoir ceci :
"border-collapse: separate;"

Dis-moi ce que ça donne.

980 appréciations
Hors-ligne
Bonjour,

les tableaux sont vraiment mal fichus, en HTML. Si les cellules du tableau ont un fonds (couleur ou image), le border radius devient invisible car la couleur des cellules vient par dessus. On peut contourner le problème en mettant un "overflow: hidden;" le table, dans le CSS.

Normalement, le border-collapse en separate doit aussi contourner la limitation mais cela peut introduire d'autres problèmes visuels.
Flora Maelyne
Responsable Blog4ever
Développeuse & Graphiste

1899 appréciations
Hors-ligne
Merci à vous deux, J'essaie dès que je peux et je reviens  vous dire, 

1899 appréciations
Hors-ligne
De retour, 
 @kiamgo@

Merci, aussi, à Maelyne, En effet les fonds sont importants, 

786 appréciations
Hors-ligne
Super ! @Mi Neth@

Je me suis un peu pris à tester divers arrondis en HTML, sans toucher au CSS.
Si cela peut aussi t'aider à pousser la réflexion...

Dans cet article brouillon, j'ai mis les codes et les résultats:
Idées tableaux arrondis

Bonne continuation

1899 appréciations
Hors-ligne
Merci kiamgo, 
Je suis d'abord passée par le css, mais sans succès, Alors, j'ai implanté le style dans le module code et j'ai mis separate XXpx; à la place de collapse dans le bloc html, 

1899 appréciations
Hors-ligne
Je viens de voir que je n'ai pas besoin de mettre la valeur px dans le bloc html, 

1899 appréciations
Hors-ligne
Le résultat de mon brouillon

Et je me suis amusée à faire une version cartouche,

Pour finir, voici un ovale allongé,

Bonne soirée,
Vous ne disposez pas des permissions nécessaires pour répondre à un sujet de la catégorie Personnalisation avancée du CSS.

Inscrivez-vous au blog

Soyez prévenu par email des prochaines mises à jour

Rejoignez les 6100 autres membres