firefox ignores border top left radius on table-cell

Vote count:

0

i have following CSS3 Rules:

.acpTable thead tr th:first-child {
    border-top-left-radius: 9px;
}

.acpTable thead tr th:last-child {
    border-top-right-radius: 9px;
}

In DOM i have a Table with the class acpTable and added via jQuery a tHead element. In current Chrome browser it works, in current firefox not. what i´m doing wrong? (The selectors works, i´ve testet with "background: green" and the correct cells would be colored)

Chrome:

Firefox:

On the right side i see its computet... O.o

What i´m doing wrong?

asked 4 mins ago

Kai

15

1 Answer

Vote count:

0

You must define the radius on the parents:

.acpTable,                              /* The Table */
.acpTable thead,                        /* The Head */
.acpTable thead tr:first-child,         /* The Row */
.acpTable thead tr th:first-child {     /* The Content */
    border-top-left-radius: 9px;
}

answered 1 min ago

Adrian Preuss

1,068