html - 表格单元格在 Firefox、IE 中未对齐

Question

我正在尝试创建一个表，其第一列是固定的。我已经以某种方式做到了，但我无法在所有浏览器中获得相同的结果。结果仅在 Chrome 上是正确的。这是我在 Firefox/IE 8 上得到的结果:

在 Chrome 上:

这是我的 HTML 代码:

<div id="riassuntoOreTecnico">

<table id="riassuntoOreTecnicoTable" >
    <tr>
        <th>Technician Name</th>
        <td style="padding-left:165px"></td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
    </tr>   
    <tr>
        <th>Table Cell</th>
        <td style="padding-left:165px"></td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>
        <td>Table Cell</td>

        <td>Table Cell</td>
    </tr>
</table>

</div>

还有 CSS:

#riassuntoOreTecnico {
    width: 94%;
    float: left;
    margin: 30px 35px;
    overflow-x: scroll;
    overflow-y: visible;
}

#riassuntoOreTecnicoTable {
/*  border-collapse: separate;*/
    border: 1px solid #ddd;
    float: left;
}

#riassuntoOreTecnicoTable th {
    background: #d5d5d5;
    font-weight: bold;
    padding: 5px 8px;
    position: absolute;
    top:auto;
    width:158px;
}

#riassuntoOreTecnicoTable td {
    border: 1px solid #d5d5d5;
    padding: 5px 8px;
}

任何人都可以建议我的代码这里有什么问题，以便我也可以在 firefox/IE8 上获得相同的结果吗？

Answer 1

我在表格 CSS 中添加了 white-space:normal 并为我修复了它。

这是更新后的代码:

#riassuntoOreTecnicoTable {
/*  border-collapse: separate;*/
    border: 1px solid #ddd;
    float: left;
    white-space:normal
}

谢谢大家