<p>I need two divs to look a bit like this: </p>

<pre><code>    |               |
 ---|    LOGO       |------------------------
|   |_______________|  LINKS                |
|             CONTENT                       |
</code></pre>

<p>What's the neatest/most elegant way of making them overlap neatly? The logo will have a fixed height and width and will be touching the top edge of the page.</p>

With absolute or relative positioning, you can do all sorts of overlapping. You've probably want the logo to be styled as such:
```
```
div#logo {
  position: absolute;
  left: 100px; // or whatever
}
```
```
Note: absolute position has its eccentricities. You'll probably have to experiment a little, but it shouldn't be too hard to do what you want.