How would you make two <div>s overlap?

css html overlap

st elmos fire · Nov 6, 2008 · Viewed 356.5k times · Source

I need two divs to look a bit like this:

    |               |
 ---|    LOGO       |------------------------
|   |_______________|  LINKS                |
|             CONTENT                       |

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.

Answer

Just use negative margins, in the second div say:

<div style="margin-top: -25px;">

And make sure to set the z-index property to get the layering you want.

How would you make two <div>s overlap?

Answer

Related questions