CSS Property empty-cells

The empty-cells property controls how to display borders and background on empty cells for a table in separated borders.


Initial value show
Inherited yes
Version CSS2
JavaScript syntax object.style.emptyCells="hide"

CSS Syntax

empty-cells: hide | show | inherit 

Property Values

The property values are listed in the following table.

Value Description
hide empty cells will not have background or borders
show Show background and borders for empty cells. Default value
inherit Inherit the empty-cells property from the parent element

Browser compatibility

empty-cells Yes Yes Yes Yes Yes


An example showing how to use empty-cells CSS property.

td {<!--   w  w  w  . j  a  v a2  s .c om-->
  border: solid 1px black;
  width: 100px;
  empty-cells: hide;
    <td scope="col">Race 1</td>
    <td scope="col">Race 2</td>
    <td scope="col">Race 3</td>
    <td scope="row">Driver A</td>
    <td>22m 33s</td>
    <td>18m 50s</td>
    <td>8m 45s</td>
    <td scope="row">Driver B</td>
    <td>24m 56s</td>
    <td>16m 23s</td>
    <td>8m 11s</td>


Click to view the demo