cambio de tamaño de la celda de la tabla pasado ancho máximo

Question

Tengo una tabla que mostrará el nombre de la cámara y su modelo. El problema es que cuando una cadena de nombre/modelo es demasiado larga, la celda se redimensiona y, por lo tanto, hace que el cuerpo de la tabla no esté sincronizado con la cabeza.

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

Este css Hass, así:

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; 
} 

El problema sólo existe en Internet Explorer 8, donde el div obtener restringido debido a un máximo de ancho, pero el elemento td no que todavía provoca la desalineación en la tabla .

¿Es la forma en que puedo forzar el td a un cierto ancho independientemente del ancho de los divs para niños?

Answer 1

Define table-layout: arreglado; en su table. Escribe así:

table{ 
table-layout:fixed; 
} 

Answer 2

Se podría aplicar los siguientes estilos de sus div 's:

overflow: hidden; 
white-space: nowrap; 

También tendrá que especificar un width.