Question

嗨，大家好，我有一个问题，我试图将TD类别中的数据推送到TD的顶部而不是它在TD的中心。以下是我网站的链接：www.thetotempole.ca

这是我的HTML代码：

<html>
<head>
<style>

body {
    font-family: Verdana, Arial, Sans-serif;
    padding:0;
    margin:0;
}

#body {
    width:100%;
    margin:0 auto;
    padding:0px;
    max-width: 768px;
}

#categories {
    float:top;
}

</style>
</head>
<body>
<table cellpadding="0" cellspacing="0" bgcolor="lightgrey" id="body" border="1">

<tr>
<td colspan="2">
<img style="width:100%; max-width: 768px; padding:0px; margin:0px;" src="images/totempolebanner.gif">
</td>
</tr>

<tr>
<td style="width:80%;">
<h3>Newest Article</h3>
<br />
<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborumLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborumLorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum</p>
</td>
<td style="width:20%;">
<div id="categories"
<h4>Categories</h4>
<ul>
<li>News</li>
<li>Movies</li>
<li>Music</li>
<li>Video Games</li>
<li>Health</li>
</ul>
</div>
</td>
</tr>

</table>
</body>

Answer 1

为该表格提供CSS vertical-align:top。

jsFiddle example （图片已从小提琴中移除以便于查看）

Answer 2

尝试

#body td {
    vertical-align: top;
}

Answer 3

首先正确关闭div类别标记。然后你只需要给你的div一个绝对位置，并且顶部0px;

#categories {
    position: absolute;
    top: 0px;
}

如何将列表移动到我的页面顶部

3 个答案: