I have an image inside a span tag But the problem is the image doesn t fit inside the span tag Instead a part of the image goes out of the span tag lt span style padding-right 3px padding-top 3px gt lt img class manImg src images ico mandatory gif gt lt img gt lt span gt I want to have that bar inside the span i e It should be adjacent to the text box How can I achieve it

Try this lt span style padding-right 3px padding-top 3px display inline-block gt lt img class manImg src images ico mandatory gif gt lt img gt lt span gt

Try using a div tag and block for span lt div gt lt span style padding-right 3px padding-top 3px display block gt lt img class manImg src images ico mandatory gif gt lt img gt lt span gt lt div gt

[html] How to fit in an image inside span tag?

I have an image inside a span tag. But the problem is the image doesn't fit inside the span tag. Instead a part of the image goes out of the span tag.

enter image description here

    <span style="padding-right:3px; padding-top: 3px;">

    <img class="manImg" src="images/ico_mandatory.gif"></img>

    </span>

I want to have that bar inside the span i.e It should be adjacent to the text box.

How can I achieve it?

This question is related to html css image

The answer is

Try this.

<span style="padding-right:3px; padding-top: 3px; display:inline-block;">

<img class="manImg" src="images/ico_mandatory.gif"></img>

</span>

Try using a div tag and block for span!

<div>
  <span style="padding-right:3px; padding-top: 3px; display:block;">
    <img class="manImg" src="images/ico_mandatory.gif"></img>
  </span>
</div>

Source: Stackoverflow.com