I want to create a natural flow of content. The problem that I now face is that the <div>
s will only line up next to each other. They will not pass the bottom edge of the floated block on the opposite side.
The following illustration clearly shows the problem. Let's say that I have 4 <div>
s with variable heights:
- Div1 always starts left
- Div2 always is displayed on the right side
- Div3 is on the left or right side, depending on the hight of Div1 and Div2
- Div4 in this situation, Div4 doesn't stick to Div2's bottom
- Div5 the same problem occurs
So, the position of the divs > Div2
should be determined by the height of the previous divs. Could you please advise me on how to achieve this?