表格单元格调整大小超过最大宽度

Dar*_*ylF 6 html css html-table internet-explorer-8

我有一个表格,显示相机的名称及其型号.问题是当名称/模型字符串太长时,单元格会调整大小,从而使表格主体与头部不同步.

<td>
    <div class="camera_details">
        <div class="camera_models">XXXCAMERAMODELXXX</div>
        <div class="camera_name">XXXCAMERANAMEXXX</div>
    </div>
</td>
Run Code Online (Sandbox Code Playgroud)

这有像这样的CSS:

td{
    max-width: 144px;
}
.camera_details {
    max-width: 144px;
}
.camera_models {
    text-overflow: ellipsis;
    overflow: hidden;
}
.camera_name {
    text-overflow: ellipsis;
    overflow: hidden;
}
table {
    table-layout: fixed;
}
Run Code Online (Sandbox Code Playgroud)

该问题仅存在于IE8上,其中div由于max-width而受到限制,但td元素不会导致表中的未对齐.

我是否可以强制td为某个宽度而不管子div的宽度?

san*_*eep 2

定义表格布局:固定;在你的table。像这样写:

table{
 table-layout:fixed;
}
Run Code Online (Sandbox Code Playgroud)