如何在侧面html标签的中心相邻制作图片

I have this code

<?php
 echo '<p style="text-align: center;"><a href="tran.php?page=A"><img src="tran.png"/></a></p>';
 echo '<p style="text-align: center;"><a href="course_list.php?page=A"><img src="courselist.png"/></a></p>';
?>

but when I run it show me this icons(pictures) under each other like this

                                       ICON1  

                                       ICON2

How I can make it next each other like this and I want the icons still in the middle of the page.

                                   ICON1   ICON2

Use one p tag.

<?php
 echo '<p style="text-align: center;"><a href="tran.php?page=A"><img src="tran.png"/></a> ';
 echo '<a href="course_list.php?page=A"><img src="courselist.png"/></a></p>';
?>

Remove the p tag. Or css them style="display: inline"

Meaning:

<p style="display:inline">.... rest of code

But unless the p tag is needed you can remove it and just use the center tag instead

You can easily do that by using by using display inline and margin auto atribbutes!

CSS:

.imgcenter {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    height: 30px; 
}
#images{
   text-align:center;
}

HTML

<div id="images">
    <a href="tran.php?page=A">
        <img class="imgcenter" border="0" alt="Mail" src="http://megaicons.net/static/img/icons_sizes/8/178/512/social-networks-instagram-icon.png"/>
    </a>
    <a href="course_list.php?page=A">
        <img class="imgcenter" border="0" alt="Facebook" src="http://megaicons.net/static/img/icons_sizes/8/178/512/social-networks-instagram-icon.png"/>
    </a>
</div>

Running example: http://jsfiddle.net/X3b5g/389/