<pre><code>&lt;div&gt;
&lt;h1&gt;Title&lt;/h1&gt;
&lt;table&gt;
...
&lt;/table&gt;
&lt;/div&gt;
</code></pre>

<p>Now, the</p>

<pre><code>&lt;h1&gt;
</code></pre>

<p>has a margin: 0;
so it is at the top of the div. The height of the div is 300px.</p>

<p>However I'd like the table to be placed at the bottom of the div, eg. valign="bottom" but for the whole table.</p>

What about this:
```
```
<style type="text/css">
#container { 
    position: absolute; 
    margin: 0;
    height:300px;
    border:1px solid #000; }
#container h1 { 
    margin:0; }
#tableContainer { 
    position: absolute;
    bottom:0; }
</style>

<div id="container">
    <h1>Title</h1>
    <div id="tableContainer">
        <table id="tableLayout">
            <tr><td>...</td></tr>
        </table>
    </div>
</div>
```
```
The only problem is that both the container div and the tableContainer divs need to be absolute positioned. Not sure if this will work for your layout.