I’ve written following HTML:
<table width="900px" style=" border-collapse:separate;">
<tr>
<td width="33%" style=" empty-cells:show; background-image:url('box1.png'); background-repeat:no-repeat; display:inline; margin-left:auto; position:static; margin-right:auto; height:300px; ">
</td>
<td width="33%" style="empty-cells:show;background-image:url('box2.png'); background-repeat:no-repeat; display:inline; margin-left:auto; position:static; margin-right:auto; height:300px; ">
</td>
<td width="33%" style="empty-cells:show;background-image:url('box3.png'); background-repeat:no-repeat; display:inline; margin-left:auto; position:static; margin-right:auto; height:300px; ">
</td>
</tr>
</table>
IE9 and chrome show all the <td> s though they are empty. But Firefox does not. What has to be done to solve this problem?
The
empty-cellsCSS property should be on thetable, not thetdelements. Also note, support is buggy.