I recently noticed that it is possible to use display: table-cell;
on an element without surrounding it with an element using display: table-row;
Example (working in IE, Chrome, FF, Safari, Opera):
<div style="display: table;">
<div style="display: table-cell;">
Text
</div>
</div>
Is this considered bad style? Should the table-cell be surrounded by a table-row or is it not necessary?
No. It does not need to be used with display: table-row
. Read here.
table-cell
just represents a <td>
or <th>
:
Specifies that an element represents a table cell.
And specifically regarding table-cell
:
For example, an image that is set to 'display: table-cell' will fill the available cell space, and its dimensions might contribute towards the table sizing algorithms, as with an ordinary cell.