-webkit- и -moz-border-radius не работает с таблицами?

Это работает

div {
  -moz-border-radius: 5px 5px 0 0;
  border:1px solid #000;
  margin:30px;
}

Это не работает

table {
  -moz-border-radius: 5px 5px 0 0;
  border:1px solid #000;
  margin:30px;
}

Кто-нибудь знает, как использовать -moz и -webkit для работы с таблицами?


css webkit gecko
person Community    schedule 10.09.2009    source источник

Ответы (1)


arrow_upward
8
arrow_downward

5.6. Влияние на таблицы

Свойства border-radius действительно применяются к элементам table и inline-table. Когда «border-collapse» равно «collapse», UA может применять свойства border-radius к элементам «table» и «inline-table», но это не обязательно. В этом случае не только граничные радиусы соседних углов не должны пересекаться, но и горизонтальные и вертикальные радиусы одного угла не должны выходить за границы ячейки в этом углу (т. Е. Другие углы ячейки не должны быть затронуты этим углом. граница-радиус). Если вычисленные значения радиусов границ вызовут этот эффект, то используемые значения всех радиусов границ таблицы должны быть уменьшены на тот же коэффициент, чтобы радиусы не пересекались и не выходили за границы соответствующих угловых ячеек.

Влияние border-radius на внутренние элементы таблицы не определено в CSS3 Backgrounds and Borders, но может быть определено в будущей спецификации. UA CSS3 должны игнорировать свойства border-radius, применяемые к внутренним элементам таблицы, когда "border-collapse" имеет значение "collapse".

person SpliFF    schedule 07.03.2011
comment
Все дело в border-collapse, что помешало радиусу границы в моем случае. - person Iharob Al Asimi; 22.05.2015