I have the following layout:

```
<div style="float:right ...">Contents</div>
<table>contents</table>

```

I want that the div would move below the table when there's no space to display both elements side-by side. How can I do that? Currently they overlap.

EDIT:

This is a template so I want to avoid coding *any* widths into the layout. The div and the table should resize based on their contents and *then* decide how they can be placed, side-by-side or table above the div. Basically I am searching for something like `min-width: <content width request>`