表格显示问题，仅限Chrome

Question

我真的不知道如何处理这个，这个表在Firefox / IE上工作正常

见：

在chrome上：

这是表格的实际css

table {
padding: 24px;
margin: 0 auto;
width: 550px;   
}

TD＃tadmin

td#tabmin {
width: 30px;
height: auto;
float: left;
font-family: "Roboto","Helvetica Neue",Helvetica,Arial,sans-serif;
font-size: 15px;
}

尝试

table-layout: fixed;

不起作用。

根据要求，我使用echo：

在php中显示表格

echo "<table style='padding:24px;margin:0 auto;width:550px;'>".  
  "<tr>".
     "<td id=tabmin  >".
     "<div class=tabminscale style=text-align:center;>"
     .$row['min']."'"."</div>". 
     "</td>".
       "<td id=tabcom >" .
       "<div id=commentaires>".
       $row['commentaire']."</br>".
       "</td>".
"</tr>".
</div>";

Answer 1

您的标记为invalid。始终使用validator检查您的标记。

所以，如果你删除PHP的东西，你会得到：

<table style='padding:24px;margin:0 auto;width:550px;'>
    <tr>
        <td id=tabmin>
            <div class=tabminscale style=text-align:center;>foo</div>
        </td>
        <td id=tabcom>
            <div id=commentaires>bar</br> <!-- invalid closing for br tag -->
        </td>
    </tr>
    </div> <!-- wrong -->
    <!-- where's </table>? -->
    <!-- also add quotes to HTML Attributes-->

将其更改为：

<table style='padding:24px;margin:0 auto;width:550px;'>
    <tr>
        <td id='tabmin'>
            <div class='tabminscale' style='text-align:center;'>foo</div>
        </td>
        <td id='tabcom'>
            <div id='commentaires'>bar<br/></div>
        </td>
    </tr>
</table>