2008-09-23 85 views
3

我无法让td“Date”具有固定的高度。如果Body部分中的数量较少td Date元素比它应该大 - 即使我将Date高度设置为10%并将Body height设置为90%。有什么建议么?HTML中固定的TD高度属性

<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浏览器。 :(

+0

请发表你的CSS以及因此有人能帮助你。 – Haabda 2008-09-23 19:31:25

回答

2

奥利是对的!给你张贴的截图,你正在使用错误的标记。你可以使用更多的东西是这样的:用CSS

<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> 

这样的:

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; 
} 
0

CSS

.Date { 
    height: 50px; 
} 
+0

适用于FF,但不适用于IE。 – rafek 2008-09-23 19:49:17

+0

不适用于IE,因为IE会将其视为最小高度。请参阅:http://stackoverflow.com/questions/56658/how-do-i-specify-in-html-or-css-the-absolute-minimum-width-of-a-table-cell#56738 – Prestaul 2008-09-24 03:36:44

0

我不完全明白你的问题,你说,如果你使用:

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

.Date td是大于它应该是怎样?你知道没有设置绝对高度应该有多大?你是否考虑边框和填充?

你可以尝试加colspan="2"到(&nbsp;

6

当您使用百分比时,它们相对于它们的容器,即使如此,它只适用于某些类型的元素。我想这个工作,你需要将高度应用到<tr> s,并给<table>一个高度。如果<table>的高度也是相对的,你也需要给它的容器一个高度。

但看着你的数据,你真的肯定你应该使用一张桌子呢?!

+0

什么不不工作?同意,这看起来不像我的表格数据! – roryf 2008-09-23 19:53:25