immagine all'interno tag link

Question

Ciao io sono la creazione di un sito web, mentre ponendo il logo del marchio all'interno di tag link in alto a destra della pagina web ho incontrato questo problema

 <a href="#" > 
      <img src='img.png'> 

     </a> 

     img { 
      height: 50px; 
      width: 50px; 
     } 

Il risultato è un tag l'involucro altezza dell'immagine è in realtà più di 50px anche se non c'è testo in un tag. Ma quando do dimensione carattere: 0 funziona.

Quindi ho bisogno del motivo per cui il tag di collegamento aumenta di altezza.

Ti prego, aiutami a capire questi concetti e non solo con alcuni codici css

ho assaggiare la sua. per favore aiutami con questo.

http://jsfiddle.net/amerrnath/TLBEx/

Ok dispiace di aver avuto la risposta dal collegamento.

White space at bottom of anchor tag

Grazie

Answer 1

Modificare il img s display al block

a { 
    display:inline-block; 
} 
a img { 
    display:block; 
} 

Vedere questo jsfiddle

Così che cosa fa? L'immagine all'interno del collegamento ha un valore predefinito display di inline-block. A si imposta su display:inline-block. È la combinazione dei due in combinazione con gli spazi bianchi all'interno dell'elemento a, a fare il problema.

È possibile simulare con due nidificati inline-blockdiv s che ha le dimensioni impostate solo su quella interna. http://jsfiddle.net/TLBEx/4/