html - How to make the <img> tags line up horizontally in the div?

Question

I need to make the images show up side by side horizontally in the div. How can I do that?

HTML:

<div class="Wrapper">
  <img src="/wp-content/uploads/2012/07/TFT.png" alt="Smiley face" height="90" width="95" />
  <img src="/wp-content/uploads/2012/07/Ltyt.png" alt="Smiley face" height="90" width="95" />
  <img src="/wp-content/uploads/2012/07/artspng" alt="Smiley face" height="90" width="95" />
</div>

Reference: jsFiddle

Answer 1

You could also use css properties display:inline-block or float : left to achieve this.

HTML Code

<div>
    <img ... />
    <img ... />
    <img ... />
</div>

CSS Code

div img{ display: inline-block;}

or

div img{ display: block;float: left;margin-right: 5px;}