Изменение размера ячейки таблицы после максимальной ширины

У меня есть таблица, в которой отображается имя камеры и ее модель. Проблема заключается в том, что когда строка имени/модели слишком длинная, размер ячейки изменяется и, следовательно, тело таблицы не синхронизируется с заголовком.

<td>
    <div class="camera_details">
        <div class="camera_models">XXXCAMERAMODELXXX</div>
        <div class="camera_name">XXXCAMERANAMEXXX</div>
    </div>
</td>

Это имеет такой 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;
}

Проблема существует только в IE8, где div ограничен максимальной шириной, а элемент td — нет, что по-прежнему вызывает смещение в таблице.

Могу ли я заставить td иметь определенную ширину независимо от ширины дочерних элементов div?

6
задан Brian Tompsett - 汤莱恩 1 January 2019 в 16:43
поделиться