html - 放置一个总是在顶部而不是在中心的元素

Question

我有一个有 2 列的表

<table border="2">
  <tr>
    <td>
        <div id="menupage" >
            ...
            ...
        </div>
    </td>

    <td align="center"  >   

        <div id="contentpage" >
            ...
            ...
        </div>

    </td>   
  </tr>
</table>

<div id="contentpage" >如果尺寸很大，我想始终保持在顶部而不是中心

Answer 1

您可以使用该CSS vertical-align属性将TD内容对齐到TOP：

垂直对齐：顶部；

请参阅此工作小提琴示例！

例如，

<table border="2">
  <tr>
    <td style="vertical-align:top;">
      <div id="menupage">
        ...
      </div>
    </td>
    <td align="center" style="vertical-align:top;">   
      <div id="contentpage" >
        ...
      </div>
    </td>   
  </tr>
</table>

Answer 2

如果您要使用表格，那么您不妨只使用valign.

例如：<div id="menupage" valign="top">

如果你想使用 CSS，你可以使用vertical-align.

您可以像这样在样式表中设置所有 td：

td {
    vertical-align: top;
}

我不知道您的经验等，所以我不会继续，但是您应该避免使用表格进行布局。你会为自己节省很多反对票和“不要使用表格”的评论。

Answer 3

您可能正在查看valign或vertical-align。

<td align="center" valign="top">
    <div id="contentpage">
    </div>
</td> 

见http://jsfiddle.net/nivas/Y84pS/

请注意，这valign是一个已弃用的属性（align和 和 也是如此border。有关完整列表，请参阅属性索引。）。获得这些功能的推荐方法是通过 CSS，vertical-align使用text-align和border.

我的 jsfiddle 示例中的第二个表使用 CSS，并获得相同的功能。