Making vertical spacing fixed in IE as it is in Chrome

Question

Hello,

For the code below, the variables $count++ , $dt1->format('F j, Y') , and $dt1->format('g:i a') display vertically in a column, about five pixels apart.

When $row["comment"] is long enough to take up more than 100 pixels in height, the behavior of $count++ , $dt1->format('F j, Y') , and $dt1->format('g:i a') diverges between Chrome and IE. In Chrome, the variables remain about five pixels apart. In IE, the space between them expands up to about 150 pixels.

How can I make these variables remain 5 pixels apart in IE if $row["comment"] is long enough to take up more than 100 pixels in height?

Thanks in advance,

John

The code:

$result = mysql_query($sqlStr);

$arr = array(); 
echo "<table class=\"commentecho\">";
$count = 1;
while ($row = mysql_fetch_array($result)) { 
    $dt1 = new DateTime($row["datecommented"], $tzFrom1);  
    $dt1->setTimezone($tzTo1);
    echo '<tr>';
    echo '<td rowspan="3" class="commentnamecount">'.$count++.'.</td>';
    echo '<td class="commentname2"><a href="http://www...com/.../members/index.php?profile='.$row["username"].'"&gt;'.$row["username"].'&lt;/a&gt;&lt;/td&gt;';
    echo '<td rowspan="3" class="commentname1">'.stripslashes($row["comment"]).'</td>';
    echo '</tr>';
    echo '<tr>';
    echo '<td class="commentname2">'.$dt1->format('F j, Y').'</td>';
    echo '</tr>';
    echo '<tr>';
    echo '<td class="commentname2a">'.$dt1->format('g:i a').'</td>';
    echo '</tr>';
    echo '<tr>';
    echo '<td class="commentname2a"></td>';
    echo '</tr>';
    }
echo "</table>";

The CSS:

    table.commentecho {
        margin-top: 230px;
        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: 30px;
        text-decoration: none;
        vertical-align: text-bottom;    

    }

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


    }

    table.commentecho td a{
       padding: 2px;
       color: #004284;
       text-decoration: none;
       font-weight:bold;
       height: 20px;
    }

    table.commentecho td a:hover{
       background-color: #004284;
       padding: 2px;
       color: #FFFFFF;
       text-decoration: none;
       font-weight:bold;
       height: 20px;
    }


.commentname2 { width: 120px;
            color: #000000;
            font-family:Arial, Helvetica, sans-serif;
            font-size: 11px;
            font-weight: normal;
            height: 20px;
            padding-top:0px;
            padding-bottom: 0px;
            vertical-align: top;

}

.commentname2 a{ width: 120px;
            color: #004284;
            font-family:Arial, Helvetica, sans-serif;
            font-size: 11px;
            font-weight: bold;
            height: 20px;
            padding-top:0px;
            padding-bottom: 0px;
            vertical-align: top;

}

.commentname2 a:hover{ width: 120px;
            color: #004284;
            font-family:Arial, Helvetica, sans-serif;
            font-size: 11px;
            font-weight: bold;
            text-decoration: underline;
            height: 20px;
            padding-top:0px;
            padding-bottom: 0px;
            vertical-align: top;

}

.commentname1 { width: 440px;
            font-family: Georgia, "Times New Roman", Times, serif;
            overflow:hidden !important;
            color: #000000;
            padding-bottom: 30px;
            vertical-align: top;
}

.commentname2a { width: 160px;
            overflow:hidden !important;
            color: #000000;
            font-family:Arial, Helvetica, sans-serif;
            font-size: 11px;
            font-weight: normal;
            height: 5px;
            padding-top:0px;
            padding-bottom: 30px;
            vertical-align: top;

}