DIV-Elemente in XHTML mit CSS 2 positionieren

[Andreas]

Hallo Leute,
ich möchte eine Webseite mal ohne Tabellen und festen Zuweisungen machen. Dazu habe ich die Seite von CSSZenGarden gesehen. Die machen Templates mittels CSS Files. Also habe ich mal einen Entwurf gemacht. Nun habe ich aber ein Problem mit dem Positionieren der Div's.

Hier erstmal der HTML-Code:
<div id="container">
    <div id="header">
        Filme Online</div>
    <div id="menu">
        Menu</div>
    <div id="content">
        <asp:ContentPlaceHolder ID="ContentPlaceHolder1" Runat="server">
        </asp:ContentPlaceHolder>
    </div>
    <div id="footer">
        Footer</div>
</div>

Und auch der bisherige CSS-Code:
body
{
    background-color: #336699;
    font-size: 10pt;
    color: White;
    font-family: Verdana;
}
#container
{
   width: 900px;
   border: solid 1px slategray;
   margin: auto;
   background-color: Transparent;
}
#header
{
    border-bottom: solid 1px slategray;
    text-align: center;
    height: 60px;
    margin: auto;
}
#menu
{
    width: 150px;
    height: 200px;
    margin-top: 2px;
    margin-left: 2px;
    border: solid 1px slategray;
}
#content
{
    border: solid 1px slategray;
    margin-left: 157px;
    width: 739px;
    margin-top: -18px;
}
#footer
{
    margin-top: 2px;
    border-top: solid 1px slategray;
    text-align: right;
}

Wenn ich die Seite nun in einem Browser anzeige (egal welcher), wird das Content-Div immer unter dem Menu-Div angezeigt. Kann ich nicht sagen, dass beide auf einer Höhe beginnen sollen? Oder gibt es bessere Möglichkeiten?

Ich würde mir auch gern Literatur zu diesen Themen zulegen. Kennt jemand was Gutes?

Andreas