empty-cells

Definition

The empty-cells property in CSS sets the behavior of empty table cells. It specifies whether cells with no content should have a border and background or not.

Examples

Show borders and background for empty cells:

table {
  empty-cells: show;
}

Hide borders and background for empty cells:

table {
  empty-cells: hide;
}

Use the default value for the empty-cells property:

table {
  empty-cells: inherit;
}

Values

Best Practices

• Use hide if you want to remove borders and backgrounds from empty cells.
• Use show if you want to display borders and backgrounds for empty cells.
• Use inherit if you want the empty-cells property to inherit the value from its parent element.
• Make sure to provide a meaningful fallback for browsers that do not support the empty-cells property.
• Consider using CSS frameworks like Bootstrap to manage the presentation of table elements, including empty cells.

Browser Compatibility

Note that empty-cells is not supported by Internet Explorer 8 and earlier versions