Question

我不能让td“Date”有固定的高度。如果Body部分中的数量较少td Date元素比它应该大 - 即使我将Date height设置为10％，Body height设置为90％。有什么建议吗？

<tr>
  <td class="Author" rowspan="2">
    <a href="#">Claude</a><br />
    <a href="#"><img src="Users/4/Avatar.jpeg" style="border-width:0px;" /></a>        
  </td>
  <td class="Date">
    Sent:
    <span>18.08.2008 20:49:28</span>
  </td>
</tr>
<tr>
  <td class="Body">
    <span>Id lacinia lacus arcu non quis mollis sit. Ligula elit. Ultricies elit cursus. Quis ipsum nec rutrum id tellus aliquam. Tortor arcu fermentum nibh justo leo ante vitae fringilla. Pulvinar aliquam. Fringilla mollis facilisis.</span>
  </td>
</tr>

我的css现在是：

table.ForumThreadViewer td.Date {
  text-align: left;
  vertical-align: top;
  font-size: xx-small;
  border-bottom: solid 1 black;
  height: 20px;
}

table.ForumThreadViewer td.Body {
  text-align: left;
  vertical-align: top;
  border-top: solid 1 black;
}

table.ForumThreadViewer td.Author {
  vertical-align: top;
  text-align: left;
}

它适用于FF但不适用于IE。：（

Answer 1

当你使用百分比时，它们是相对于它们的容器，即便如此，它只适用于某些类型的元素。我认为要使其工作，您需要将高度应用于<tr> s，并为<table>提供一个高度。如果<table>高度也是相对的，则还需要给它的容器一个高度。

但是看看你的数据，你真的确定你应该使用一张桌子吗？

Answer 2

奥利是对的！然后给出你发布的截图，你使用了错误的标记。你可以使用更像这样的东西：

<div class="post">
  <div class="author">
    <a href="#">Claude</a><br />
    <a href="#"><img src="Users/4/Avatar.jpeg" /></a>        
  </div>
  <div class="content">
    <div class="date">Sent: 18.08.2008 20:49:28</div>
    <div class="body">
      This is the content of the message.
    </div>
  </div>
  <div class="clear">&nbsp;</div>
</div>

用这样的css：

div.post {
  border: 1px solid #999;
  margin-bottom: -1px; /* collapse the borders between posts */
}
div.author {
  float: left;
  width: 150px;
  border-right: 1px solid #999;
}
div.content {
  border-left: 1px solid #999;
  margin-left: 150px;
}
div.date {
  border-bottom: 1px solid #999;
}
div.clear {
  clear: both;
  height: 0;
  line-height: 0;
}

Answer 3

CSS

.Date {
    height: 50px;
}

Answer 4

我不完全理解你的问题，你说如果你使用这个：

.Date {
 height: 10%
}
.Body {
 height: 90%;
}

.Date td是否比它应该更大？如果不设置绝对高度，你怎么知道应该有多大？你是考虑边界和填充吗？

您可以尝试将colspan="2"添加到.Body td或额外的<td>元素，只有不间断的空格（ ）

修复了HTML中的TD高度属性

4 个答案: