2010-06-28 78 views
0

下面的CSS精美地将浏览器窗口顶部以下的commentecho 250像素设置为桌面。但是,在IE 8中,表格在浏览器窗口顶部下方约2个像素处开始。表格在Chrome浏览器中精美呈现,但不在IE 8中

我该如何在IE 8中做到它在Chrome中的功能?

由于提前,

约翰

table.commentecho { 
    margin-top: 250px; 
    margin-left: 30px; 
    text-align: left; 
    font-family: Arial, Helvetica, sans-serif; 
    font-weight: normal; 
    font-size: 14px; 
    color: #000000; 
    width: 600px; 
    table-layout:fixed; 
    background-color: #FFFFFF; 
    border: 2px #FFFFFF; 
    border-collapse: collapse; 
    border-spacing: 2px; 
    padding: 1px; 
    text-decoration: none; 
    vertical-align: text-bottom;  
    margin-bottom: 30px; 

} 

table.commentecho td { 
    border: 2px solid #fff; 
    text-align: left; 
    height: 18px; 
    overflow:hidden; 

} 

table.commentecho td a{ 
    padding: 2px; 
    color: #3399CC; 
    text-decoration: none; 
    font-weight:bold; 
    overflow:hidden; 
    height: 18px; 
} 

table.commentecho td a:hover{ 
    background-color: #3399CC; 
    padding: 2px; 
    color: #FFFFFF; 
    text-decoration: none; 
    font-weight:bold; 
    overflow:hidden; 
    height: 18px; 
} 

编辑:这里是呈现的HTML的例子:

<table class="samplesrec"> 
<tr> 
<td class="sitename1"><a href="http://www.zipps-sportscafe.com" TARGET="_blank">Where to go if You're Not Trying to Lose Weight</a> <div class="dispurl">zipps-sportscafe.com</div></td></tr><tr><td class="sitename2name">Submitted by <a href="http://www.domain.com/sample/members/index.php?profile=johnjohn2">johnjohn2</a> on June 16, 2010 &nbsp &nbsp 9:56 am</td> 
</tr> 
<tr> 
<td class="sitename2"><a href="http://www.domain.com/sample/comments/index.php?submissionid=58">4 comments</a></td> 
</tr> 
</table> 


<table class="commentecho"> 
<tr> 
<td rowspan="3" class="commentnamecount">1.</td> 
<td class="commentname2"><a href="http://www.domain.com/sample/members/index.php?profile=johnjohn2">johnjohn2</a></td> 

<td rowspan="3" class="commentname1">Talk about fatty food...</td></tr><tr><td class="commentname2">June 16, 2010</td></tr> 

<tr><td class="commentname2a">9:56 am</td></tr><tr><td rowspan="3" class="commentnamecount">2.</td><td class="commentname2"><a href="http://www.domain.com/sample/members/index.php?profile=johnjohn2">johnjohn2</a></td> 

<td rowspan="3" class="commentname1">Okay, but you have to admit, it's pretty tasty. Wash it all down with a Coke. Can't beat a stomach full of grease and a caffeine buzz/sugar rush. </td></tr> 

<tr><td class="commentname2">June 16, 2010</td></tr> 

<tr><td class="commentname2a">9:58 am</td></tr> 

<tr><td rowspan="3" class="commentnamecount">3.</td><td class="commentname2"><a href="http://www.domain.com/sample/members/index.php?profile=johnjohn2">johnjohn2</a></td><td rowspan="3" class="commentname1">They slather the mayo onto their sandwiches. But hey, sometimes it's okay to indulge. </td></tr> 

<tr><td class="commentname2">June 16, 2010</td></tr><tr><td class="commentname2a">2:25 pm</td></tr> 

<tr><td rowspan="3" class="commentnamecount">4.</td><td class="commentname2"><a href="http://www.domain.com/sample/members/index.php?profile=johnjohn2">johnjohn2</a></td><td rowspan="3" class="commentname1">Hmm...</td></tr> 

<tr><td class="commentname2">June 18, 2010</td></tr><tr><td class="commentname2a">3:07 pm</td></tr></table> 
+0

我们可以看到一些HTML?至少有一个声明? – 2010-06-28 13:46:37

+0

为防万一,它可以分享表格标记吗? – Fenton 2010-06-28 13:46:46

+0

您是否事先重置了CSS? – 2010-06-28 13:48:03

回答

1

最快的方式将有条件地添加CSS类IE8和任何其他8个浏览​​器。

<!--[if IE 8]>  
<style type="text\css"> 
.IE8tableFix 
{ 
//a quick css hack to fix the table 
} 
</style> 
<![endif]--> 

你可以做类似上面的事情或输出一个特定的链接到任何版本的CSS样式表,即你喜欢的任何版本。

这里是一个很好的链接http://www.quirksmode.org/css/condcom.html有条件的评论中即

+0

谢谢。这看起来有希望。 – John 2010-06-28 18:21:18

相关问题