¿Cómo detener el cambio de tamaño de la tabla cuando crece el contenido?

Question

Tengo un table, cuyas celdas están llenas de imágenes. Me gustaría que las imágenes crezcan más cuando pasé el cursor sobre ellas y me gustaría que las celdas de la tabla permanezcan en el mismo tamaño.

Cambiar el estilo img al position:relative no funciona. Cambiarlo a position:absolute funciona, pero no sé la posición absoluta de las imágenes.

¿Existe una solución elegante para este problema al usar CSS? Prefiero no usar ningún JavaScript.

Answer 1

Uso style="table-layout:fixed;", pero esto va a hacer que el texto o las imágenes se superponen con otras columnas en caso de que exceda el ancho. Asegúrese de no colocar frases de texto largas sin espacios.

Answer 2

Agregue vertical-align:top a los elementos td.

Answer 3

Use table-layout: fixed para su tabla y un ancho fijo para la tabla y/o sus celdas.

Answer 4

Puedes hacer para que puedas usar la posición, z-index, izquierda, arriba.

debería mirar esta manera,

http://jsfiddle.net/wWTfs/

Answer 5

Uso min-width en sus células, mira aquí un ejemplo

.cell1{ 
display:table-cell; 
width:100px; 
min-width:100px; 
border: 2px dashed #40f;  
} 

http://jsfiddle.net/Gueorguip13/avzuadhp/3/