内联元素不会与其他内联图像一起休息

Inline element will not rest even with other inline images

当我制作一个 jsfiddle 来练习我想在网站上做的事情时,它运行良好。 http://jsfiddle.net/texascapresident/27g6f8dw/

HTML

<div class="link-image-container">
    <a href="https://twitter.com"><img class="employee-contact-images" src="http://www.texasca.com/graphics/icons/twitter-link.png" /></a>
    <a href="https://www.linkedin.com/in/zacharygcook" target="_blank" ><img class="employee-contact-images" src="http://www.texasca.com/graphics/icons/linkedin-link.png" /></a>
    <form class="form-containing-email" action="contact-team-member.php" method="POST">
        <INPUT TYPE="hidden" NAME="teamMemberName" VALUE="Zach">
        <INPUT TYPE="hidden" NAME="teamMemberTitle" VALUE="CTO" >
        <input type="image" class="special-email-image" src="http://www.texasca.com/graphics/icons/email-link.png" >
    </form>
</div>

CSS

.form-containing-email {
    display: inline;
}

然而,在网站上的实践中,其中一张图片(表格中的一张)表现异常。

如您所见,最后一张图片有点"popped up"。我不确定出了什么问题。

网站上的HTML&CSS稍微复杂一些,大家可以自己去看看。

HTML 站点:http://texasca.com/team.html

CSS 站点:http://texasca.com/includes/team.css

如果可以请帮帮我!谢谢。

您需要在 vertical-align:top 部分填写表格 (<form class="form-containing-email" action="contact-team-member.php" method="POST">)。