Question

在"display:inline"上使用Chrome时，有什么特别原因可以解析为"<table>"并且有一个已知的解决方法吗？在Firefox中一切正常，但由于某些原因，当我输入

时，chrome拒绝做正确的事情

<table style="display:inline;">
    table stuff
</table>

firefox alignment：firefox alignment http://dkarapet.userworld.com/cart_noDB/firefox_alignment.png

chrome alignment：chrome alignment http://dkarapet.userworld.com/cart_noDB/chrome_alignment.png

两个版本都使用相同的html源，将display属性设置为内联。单独的表不包含在任何其他div中，它们都包含在一个大div中。这是html相关部分的pastie。

Answer 1

尝试inline-block。

Answer 2

css 2.1定义inline-table。不知道它有多广泛支持，但听起来可能就是你想要的。

http://www.w3.org/TR/CSS21/tables.html#table-display

虽然从你的截图中看起来你真正想要的是控制垂直对齐。

Answer 3

为什么你要将一个表元素设置为内联？它应该是一个表格的显示。用户错误IMO。

你必须改变所有tr和td元素的显示模式，否则它们将不正确地渲染，最有可能。

如果您需要将表与另一个元素放在同一行中，请在表格周围包裹div并将其浮动。不要乱用桌子。

编辑：正如我在上一次评论中指定的那样，你应该把vertical-align搞得一团糟，并且可能会把它放到桌面上。

Answer 4

要了解您所追求的内容，您只需将其添加到每个td：

<td valign="top">

这会强制所有内容都位于每个单元格的顶部，并会强制显示内嵌内容，以及您希望它们的显示方式。这里不需要CSS。

它应该像这样编码：

<table>
 <tr>
  <td valign="top">item 1 info</td>
  <td valign="top">item 2 info</td>
  <td valign="top">item 3 info</td>
 </tr>
 <tr>
  <td valign="top">item 4 info</td>
  <td valign="top">item 5 info</td>
  <td valign="top">item 6 info</td>
 </tr>
</table>

编辑：或者如果（出于某种原因）你没有使用TR和TD，你可以试试这个：

<table style="vertical-align:top;">
    table stuff
</table>

Chrome不尊重表格元素的显示属性

4 个答案: