CSS stacking div with variable height on two columns

Question

So I\'m working the profile page of a user on my website. And I\'m having a little problem with the CSS.

My problem is the following: I have four div boxes with a fixed

Answer 1

The best solution I have found for this issue is to tag each post with the class .odd and .even or .left and .right then simply float left the odd/left posts and float right the even/right posts. Note that this only works visually if the widths of the posts add up to the width of their container. Then to make this work on a variety of screen sizes simply add an @media query to change the float on the even/right posts to be left on screens smaller than the width of the dual column container.