css - CSS 表格单元格浮动内容影响另一个表格单元格内容的对齐方式

Question

当我在table-cell元素中获取一些浮动内容时，它会影响下一个“表格单元格”内容的对齐方式。即使我消除了浮动影响。

请看这里。

现在，如果我使最后一个单元格内容浮动，那么所有单元格中的内容都会向下移动；

请告诉我这背后的原因不是修复。

Answer 1

固定在：http ://cssdesk.com/KLBzv

两件事情：

1. float:left 在 div 和 clear 之间没有浮动，或者我不知道你想要什么；

2. 所有单元格在此属性中都有 css vertical-align:top 和中间的数字

Answer 2

修理：

现在它就像一个table-cell，您将添加：

<div class="cell aligntop">
</div>

<style type="text/css">
    .aligntop { 
        vertical-align: top;
    }
</style>

到中间元素，迫使内容位于顶部 -演示：http ://cssdesk.com/2sY46

为什么会这样？

a的默认行为/垂直对齐是table-cell：baseline因此，内容自然被推到底部。尽管当您应用一个.left要求以某种方式推送内容的类时，它会在float: left;浮动后启动并与表格单元格的左上角相邻 - 另请参阅垂直对齐 MDN 参考以获取更多信息。