我正在尝试将两个图像并排放置在一起,但由于某种原因,它总是将图像显示在彼此之下。有人知道我能如何让他们集中在彼此旁边?
谢谢!
<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。