html - When linking a relative image in the display of a block, it's links the width of the entire page? -


i have found post fixes problem no specific position value included, image positioned relatively. when add link onto image , displayed block , vertically centered, width of page becomes link. how stop this?

#logo {    position: relative;    display: block;    margin: 0 auto;    margin-top: 30px;  }
<a href="#">    <img id="logo" src="images/dimatteos2.png" />  </a>

it not position: relative; display: block;. block level elements take full width. if don't want use full width, can replace using display: inline-block;.

#logo {    display: inline-block;    margin: 0 auto;    margin-top: 30px;  }
<a href="#">    <img id="logo" src="images/dimatteos2.png" />  </a>


Comments

Popular posts from this blog

javascript - Using jquery append to add option values into a select element not working -

Android soft keyboard reverts to default keyboard on orientation change -

jquery - javascript onscroll fade same class but with different div -