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;
我最近注意到可以使用display：table-cell;在一个元素上没有使用display：table-row;
Example (working in IE, Chrome, FF, Safari, Opera):
示例（在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?
这被认为是不好的风格吗？表格单元是否应该被表格行包围，还是没有必要？
2 个解决方案
#1
16
No. It does not need to be used with display: table-row. Read here.
不需要。它不需要与显示器一起使用：table-row。在这里阅读
table-cell just represents a <td> or <th>:
table-cell只代表或：
Specifies that an element represents a table cell.
指定元素表示表格单元格。
And specifically regarding table-cell:
特别是关于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.
例如，设置为“display：table-cell”的图像将填充可用的单元格空间，其尺寸可能有助于表格大小调整算法，就像普通单元格一样。
#2
11
From Everything You Know About CSS Is Wrong :
从你所知道的关于CSS的一切都是错误的：
Anonymous Table Elements
CSS tables happily abide by the normal rules of table layout, which enables an extremely powerful feature of CSS table layouts: missing table elements are created anonymously by the browser. The CSS2.1 specification states:
CSS表格很乐意遵守表格布局的常规规则，这使得CSS表格布局具有极其强大的功能：浏览器匿名创建缺少的表格元素。 CSS2.1规范声明：
Document languages other than HTML may not contain all the elements in the CSS 2.1 table model. In these cases, the “missing” elements must be assumed in order for the table model to work. Any table element will automatically generate necessary anonymous table objects around itself, consisting of at least three nested objects corresponding to a “table”/“inline-table” element, a “table-row” element, and a “table-cell” element.
除HTML之外的文档语言可能不包含CSS 2.1表模型中的所有元素。在这些情况下，必须假定“缺少”元素才能使表模型起作用。任何表元素都会自动生成必要的匿名表对象，包括至少三个对应于“table”/“inline-table”元素的嵌套对象，一个“table-row”元素和一个“table-cell”元素。
What this means is that if we use
display: table-cell;without first containing the cell in a block set todisplay: table-row;, the row will be implied—the browser will act as though the declared row is actually there.这意味着如果我们使用display：table-cell;如果没有首先在一个块中包含单元格来显示：table-row ;,那么该行将被暗示 - 浏览器将表现为就像声明的行实际存在一样。
So no, there's nothing wrong with using display:table-cell without containing display:table-row. The CSS it produces is perfectly valid and has some very interesting use cases. For more info on using anonymous table Elements, see the article I'm quoting from.
所以不，使用display没有错：table-cell不包含display：table-row。它产生的CSS非常有效，并且有一些非常有趣的用例。有关使用匿名表元素的更多信息，请参阅我引用的文章。
Note :
The fact that it produces valid CSS doesn't mean that the behavior of display:table-cell without display:table-row or display:table-row is stable. Even today (February 2016), the behavior of anoymous table elements remain inconsistent across browsers. See Inconsistent behavior of display: table and display: table-cell for more details.
它生成有效CSS的事实并不意味着display：table-cell没有display：table-row或display：table-row的行为是稳定的。即使在今天（2016年2月），令人厌恶的表元素的行为在浏览器中仍然不一致。有关详细信息，请参阅display：table和display：table-cell的不一致行为。
#1
16
No. It does not need to be used with display: table-row. Read here.
不需要。它不需要与显示器一起使用：table-row。在这里阅读
table-cell just represents a <td> or <th>:
table-cell只代表或：
Specifies that an element represents a table cell.
指定元素表示表格单元格。
And specifically regarding table-cell:
特别是关于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.
例如，设置为“display：table-cell”的图像将填充可用的单元格空间，其尺寸可能有助于表格大小调整算法，就像普通单元格一样。
#2
11
From Everything You Know About CSS Is Wrong :
从你所知道的关于CSS的一切都是错误的：
Anonymous Table Elements
CSS tables happily abide by the normal rules of table layout, which enables an extremely powerful feature of CSS table layouts: missing table elements are created anonymously by the browser. The CSS2.1 specification states:
CSS表格很乐意遵守表格布局的常规规则，这使得CSS表格布局具有极其强大的功能：浏览器匿名创建缺少的表格元素。 CSS2.1规范声明：
Document languages other than HTML may not contain all the elements in the CSS 2.1 table model. In these cases, the “missing” elements must be assumed in order for the table model to work. Any table element will automatically generate necessary anonymous table objects around itself, consisting of at least three nested objects corresponding to a “table”/“inline-table” element, a “table-row” element, and a “table-cell” element.
除HTML之外的文档语言可能不包含CSS 2.1表模型中的所有元素。在这些情况下，必须假定“缺少”元素才能使表模型起作用。任何表元素都会自动生成必要的匿名表对象，包括至少三个对应于“table”/“inline-table”元素的嵌套对象，一个“table-row”元素和一个“table-cell”元素。
What this means is that if we use
display: table-cell;without first containing the cell in a block set todisplay: table-row;, the row will be implied—the browser will act as though the declared row is actually there.这意味着如果我们使用display：table-cell;如果没有首先在一个块中包含单元格来显示：table-row ;,那么该行将被暗示 - 浏览器将表现为就像声明的行实际存在一样。
So no, there's nothing wrong with using display:table-cell without containing display:table-row. The CSS it produces is perfectly valid and has some very interesting use cases. For more info on using anonymous table Elements, see the article I'm quoting from.
所以不，使用display没有错：table-cell不包含display：table-row。它产生的CSS非常有效，并且有一些非常有趣的用例。有关使用匿名表元素的更多信息，请参阅我引用的文章。
Note :
The fact that it produces valid CSS doesn't mean that the behavior of display:table-cell without display:table-row or display:table-row is stable. Even today (February 2016), the behavior of anoymous table elements remain inconsistent across browsers. See Inconsistent behavior of display: table and display: table-cell for more details.
它生成有效CSS的事实并不意味着display：table-cell没有display：table-row或display：table-row的行为是稳定的。即使在今天（2016年2月），令人厌恶的表元素的行为在浏览器中仍然不一致。有关详细信息，请参阅display：table和display：table-cell的不一致行为。