Ниже приведен мой код, и я хочу понять, что почему #firstDiv толкается вниз всеми браузерами. Я действительно хочу понять внутреннюю работу того, почему ее толкают вниз, а не тянут ее вверх так или иначе. (и я знаю, как выровнять их вершины:))
И я знаю, что его переполнение: скрытое, которое вызывает его, но не уверен, почему его нажатие этого div вниз.
<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;
}