1

I have an image that is nested inside an anchor tag which is nested inside a div. The image has been given a width of 40px and a height of 40px.

When I look the image in the dev tools, it shows me that is has a width and height of 40px and behaves as intended.

enter image description here

But when I check the anchor tag in which the image is nested it shows me that it has a height of 15px.

How is that possible? Since the anchor tag is wrapped around the image and the image has a height and width of 40px shouldn't the anchor tag also have a height and width of 40px?

Why is the anchor tag showing under my image? Why is it not wrapping my image tag? What is this behaviour?

enter image description here

Oxin
  • 63
  • 6

1 Answers1

0

The element defaults to a display value of inline. Therefore it will resort to the default line-height of 18px. Yours shows 15px. Did you add some sort of padding or margin?

jason lee
  • 11
  • 3