Two images next to each other, centered on page

[Clueless2012]

Help, please!!!
I've been searching here and elsewhere for a solution to my problem for hours, and tried many different things, but nothing works:

I'm trying to put two images next to each other, centered in the middle.
However, the images always show up aligned left, and on top of each other.
What am I doing wrong?

I've got this:
<div style="text-align: center"><a href="http://www.wppi.com" target="_blank"><img alt="WPPI" src="/images/WPPI_blk_100.jpg"/></a><a href="http://www.napcp.com" target="_blank"><img alt="NAPCP" src="/images/napcp_newlogo70.png"/></a></div>

My html knowlege is VERY limited, so whenever I try to do something, I basically have to look up everything in forums etc. ...

Thanks in advance for your help!!!

[JorgeM]

If the width of the pictures is less than the width of the div and you dont have any other styles in place for your images such as "display:block", then they should line up next to each other.

[Clueless2012]

Well, unfortunately they don't...

Do I need to define the width and the height of the div in the code?

[JorgeM]

If you simply copy the code you provided and paste it into a new HTML doc, the images line up side by side. There must be something else in your code causing this. Can you provide more revelant code, or simply provide a link to your page so that the source code can be seen?

Your code outputs two images side by side.

<div style="text-align: center">
  <a href="#"><img src="#"/></a><a href="#"><img src="#"/></a>
</div>

[Clueless2012]

I have a website template that uses markdown for customizing.
So I entered my text first, and then the html code for the images.
(I tried to insert the images using markdown first, but they were also on top of each other, despite the text above being centered.)

Could there be some kind of clash between the template coding (which I can't see, and would be too inexperienced to understand anyway...) and the code I entered?

[JorgeM]

Well, it appears so. As I mentioned, if you copy and paste the code above in a blank file and save it as a "filename.htm", if opened with a browser, you'll see the images centered and on the same line.

There are several reasons why this is not working for you. without knowing the specifics, it would be hard to tell.

If there is a style such as the display:blockthat is being applied to images, this would cause them to be on their own line in the display. I do not know if this is the cause, but it is one example.

If it is a style issue, you should be able to address it by applying an inline style. Inline styles take precendence.

So for example,

<div style="text-align: center">
  <a href="#">
    <img src="#" style="display:inline"/>
  </a>
  <a href="#">
    <img src="#" style="display:inline"/>
  </a>
</div>