border-radius didn't apply to my table

Question

i apply a border-radius to my table but it's not working

CSS :

table {
    border: 1px solid;
    border-radius: 10px;
    border-collapse: collapse;
}

here's a FIDDLE

PS. i want to use border-collapse: collapse not border-collapse: separate

Have you seen this? http://stackoverflow.com/questions/628301/css3s-border-radius-property-and-border-collapsecollapse-dont-mix-how-can-i — BoltClock, May 23 '14 at 09:10

score 4 · Answer 1 · edited May 23 '14 at 09:13

4

Did you try removing border-collapse: collapse?

table {
    border: 1px solid;
    border-radius: 10px;
}

edited May 23 '14 at 09:13

Emanuel Vintilă

answered May 23 '14 at 09:11

Kets

and with `border-collapse` it's impossible ? – Hayi May 23 '14 at 09:25
@Youssef use `border-spacing: 0; instead` of `border-collapse: collapse;` – Kets May 23 '14 at 10:13

score 2 · Answer 2 · answered May 23 '14 at 09:11

2

remove your border-collapse

table{
    border: 1px solid;
    border-radius: 10px;
}

answered May 23 '14 at 09:11

Lawrence Boadilla

and with `border-collapse` it's impossible ? – Hayi May 23 '14 at 09:24
1

@Youssef its collapsing the `border`, so most of the `border-` properties are likewise will not work, save for `border`because you are specifying it to have border. – Lawrence Boadilla May 23 '14 at 09:33

score 0 · Answer 3 · answered May 23 '14 at 12:16

0

Edit this in your table:

table {
    border: 2px solid black;
    border-radius: 10px;
    overflow:hidden;
}

answered May 23 '14 at 12:16

score -3 · Answer 4 · edited Jun 18 '14 at 03:37

-3

Box properties only works with DIV tag. you can do that if you want to create your table with DIV.

edited Jun 18 '14 at 03:37

bjb568

answered May 23 '14 at 09:12

user3667583

1

"Box properties only works with DIV tag." What do you mean? What are these box properties you refer to, and why only div? – BoltClock May 23 '14 at 09:14
This does not provide an answer to the question. To critique or request clarification from an author, leave a comment below their post. – bjb568 Jun 18 '14 at 03:33

4 Answers4