Aşağıdaki benim kod olduğunu anlamak istiyorumneden#firstDiv aşağıya doğru tüm tarayıcılar tarafından itiliyor. Ben de çok istiyorumanlıyorumöyle veya böyle kendi varlık aşağı yukarı doğru çekerek onu yerine itti neden gerçeği iç işleyişini. (ve onların üstleri hizalamak için nasıl biliyorum :))

Ve buna neden olan ama emin değilim onun aşağı olan div iten neden onun taşması biliyorum:gizli.

<div id="container">
<div id="firstDiv">FIRST</div>
<div id="secondDiv">SECOND</div>
<div id="thirdDiv">THIRD
<br>some more content<br> some more content
</div>
</div>

body{
    width: 350px;
    margin: 0px auto;
}
#container {
    border: 15px solid orange;   
}
#firstDiv{
    border: 10px solid brown;     
    display:inline-block;
    width: 70px;      
    overflow:hidden;  
}
#secondDiv{
    border: 10px solid skyblue;         
    float:left;
    width: 70px;     
}
#thirdDiv{
    display:inline-block;
    border: 5px solid yellowgreen;    
}

http://jsfiddle.net/WGCyu/.

vertical-align varsayılan değer CSS baseline & bu kural da inline-block http://www.brunildo.org/test/inline-block.html okuyun Bu geçerlidir

inline-block DİV vertical-align:top yaz.

Bu http://jsfiddle.net/WGCyu/1/ Kontrol edin