How can I get two divs of different heights always side-by-side, with text appearing directly below the 1st div and never overlapping the 2nd div?

Question

This is a bit fiddly, but I\'ll try to explain it. What I\'m trying to get working with CSS is:

1. Two divs at the top of the page ("A" and "B"