html - img - ¿Cómo evitar que la tabla cambie de tamaño cuando los contenidos crecen?

title html attribute

Question

Tengo una table , cuyas celdas están llenas de imágenes. Me gustaría que las imágenes se agrandaran cuando pasas el cursor sobre ellas y me gustaría que las celdas de la tabla permanezcan en el mismo tamaño.

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

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

Answer 1

Añadir vertical-align:top a los elementos td.

Answer 2

Usa el ancho mínimo en tus celdas, mira un ejemplo aquí

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

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

Answer 3

Usar table-layout: fixed para su tabla y algo de ancho fijo para la tabla y / o sus celdas.

Answer 4

Use style="table-layout:fixed;" , pero esto hará que el texto o las imágenes se superpongan con otras columnas en caso de que exceda el ancho. Asegúrate de no colocar frases largas de texto sin espacios.

Answer 5

Usted puede hacer para que pueda utilizar la posición, índice z, izquierda, arriba.

deberías mirar de esta manera,

http://jsfiddle.net/wWTfs/