CSS – 中心两个图像在css并排

前端之家收集整理的这篇文章主要介绍了CSS – 中心两个图像在css并排前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我正在尝试将两个图像并排放置在一起,但由于某种原因,它总是将图像显示在彼此之下。有人知道我能如何让他们集中在彼此旁边?

谢谢!

HTML代码

<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代码

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

解决方法

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

.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

猜你在找的CSS相关文章