Copyright © tutorialspoint.com

CSS - empty-cell

previous next


Description:

The empty-cell property is used in the separate-border table layout model to control the rendering of table cells which have no visible content.

Possible Values:

Applies to:

All the elements with a display of table-cell

DOM Syntax:

object.style.emptyCell="hide";

Example:

Here is the empty-cells property used to hide borders of empty cells in the <table> element.

<style type="text/css">
table.empty{
    width:350px;
    border-collapse:separate;
    empty-cells:hide;
}
td.empty{
    padding:5px;
    border-style:solid;
    border-width:1px;
    border-color:#999999;
}
</style>
<table class="empty">
<tr>
<th></th>
<th>Title one</th>
<th>Title two</th>
</tr>
<tr>
<th>Row Title</th>
<td class="empty">value</td>
<td class="empty">value</td>
</tr>
<tr>
<th>Row Title</th>
<td class="empty">value</td>
<td class="empty"></td>
</tr>
</table>

This will produce following result:

Title one Title two
Row Title value value
Row Title value

To Become more comfortable - Do Online Practice


previous next

Copyright © tutorialspoint.com