Why is this inline-block element pushed downward?

Question

Following is my code and I want to understand that why #firstDiv is being pushed downward by all browsers. I really want to understand the inner wo

Answer 1

the problem is because you have applied float:left on the second div. which makes the second div to come on the left side and your first div drops and comes after your second div. If you apply float:left on the first div also, your problem will be gone.

overflow:hidden is causing no problem to your layout, overflow:hidden affects only inner elements of a div, it has nothing to do with other elements which are outside.