Vi siete mai trovati nella condizione in cui dovete inserire un immagine all'interno di una cella di una tabella (magari in modo dinamico tramite jQuery) e, in seguito all'inserimento, la cella risulti inspiegabilmente di dimensioni leggermente più grandi rispetto alla vostra immagine? Io sono incappato in questo problema inserendo piccole immagini 20x20 in una griglia, durante lo sviluppo di Battaglia Navale in JavaScript.

Credendo di essere finito in qualche variazione del box model generata in modo automatico dal browser ho impostato le proprietà margin e padding a 0, senza ottenere successo.

Il problema si risolve agilmente impostando font-size a 0. In questo modo eventuali caratteri speciali all'interno della cella non aumentano la sua dimensione, consentendo all'immagine di adattarsi perfettamente.