Come smettere di ridimensionare la tabella quando i contenuti crescono?

Question

Ho un table, le cui celle sono piene di immagini. Vorrei che le immagini diventassero più grandi quando si passa sopra di esse e vorrei che le celle del tavolo restassero alla stessa dimensione.

La modifica dello stile img su position:relative non funziona. Cambiarlo in position:absolute funziona, ma non conosco la posizione assoluta delle immagini.

Esiste una soluzione elegante a questo problema utilizzando i CSS? Preferirei non usare alcun JavaScript.

Answer 1

Usa style="table-layout:fixed;", ma questo farà testo o le immagini si sovrappongono con altre colonne nel caso superi la larghezza. Assicurati di non inserire frasi di testo lunghe senza spazi.

Answer 2

Aggiungere vertical-align:top agli elementi td.

Answer 3

Utilizzare table-layout: fixed per la tabella e qualche larghezza fissa per la tabella stessa e/o le relative celle.

Answer 4

Si può fare per poter utilizzare la posizione, z-index, sinistra, in alto.

si dovrebbe guardare a questo modo,

http://jsfiddle.net/wWTfs/

Answer 5

Usa min-width nelle vostre cellule, guarda un esempio qui

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

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