인라인 요소가 다른 인라인 이미지에서도 유지되지 않습니다

Question

웹 사이트에서 수행하고 싶은 작업을 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; 
} 

그러나, 웹 사이트에서 실제로 이미지 중 하나 (형태의 하나) 이상하게 동작합니다. 당신이 볼 수 있듯이

는, 마지막 이미지는 "팝업"의 일종이다. 무슨 일이 일어나고 있는지 잘 모르겠습니다.

웹 사이트의 HTML & CSS는 약간 더 복잡하며 직접 사용해보십시오. 사이트의

HTML : 사이트의 http://texasca.com/team.html

CSS : 당신이 할 수있는 경우 http://texasca.com/includes/team.css

이 저를 도와주세요! 고맙습니다.

Answer 1

vertical-align:top 섹션에 양식 (<form class="form-containing-email" action="contact-team-member.php" method="POST">)을 제공해야합니다.