In the HTML and CSS snippet below we have two divs with a class called "inner". Both these divs are set to display:inline-block;
and hence they should display next to each other and not on top of each other. So why do they display on top of each other?
Note: box-sizing
is set to border-box
. Both inner divs are exactly 200px even with the 1px border and their parent is exactly 400px.
Answer?
See this post on StackOverflow. Thanks to everyone who contributed.