CSS - center two images in css side by side

css

Solution

Try changing

#fblogo {
    display: block;
    margin-left: auto;
    margin-right: auto;
    height: 30px; 
}

to

.fblogo {
    display: inline-block;
    margin-left: auto;
    margin-right: auto;
    height: 30px; 
}

#images{
    text-align:center;
}

HTML

<div id="images">
    <a href="mailto:olympiahaacht@hotmail.com">
    <img class="fblogo" border="0" alt="Mail" src="http://olympiahaacht.be/wp-content/uploads/2012/07/email-icon-e1343123697991.jpg"/></a>
    <a href="https://www.facebook.com/OlympiaHaacht" target="_blank">
    <img class="fblogo" border="0" alt="Facebook" src="http://olympiahaacht.be/wp-content/uploads/2012/04/FacebookButtonRevised-e1334605872360.jpg"/></a>
</div>​

DEMO.

Problem

I am trying to center two images side by side, but for some reason it always displays the images beneath each other. Does anyone know how I could get them centered and next to each other? Thanks! HTML code ``` <a href="mailto:olympiahaacht@hotmail.com"> <img id="fblogo" border="0" alt="Mail" src="http://olympiahaacht.be/wp-content/uploads/2012/07/email-icon-e1343123697991.jpg"/></a> <a href="https://www.facebook.com/OlympiaHaacht" target="_blank"> <img id="fblogo" border="0" alt="Facebook" src="http://olympiahaacht.be/wp-content/uploads/2012/04/FacebookButtonRevised-e1334605872360.jpg"/></a>` ``` CSS code ``` #fblogo { display: block; margin-left: auto; margin-right: auto; height: 30px; } ```

Original source