Navigation links des Inhalts (Inhalts ist center)

    Guten Tag,
    Ich bin gerade an einer Websiteprogrammierung, das läuft bis jetzt ganz gut, jedoch habe ich ein kleines Problem.
    Ich habe den Inhalt erstellt (float: center) und möchte nun meine Navigation links davon. Leider verzieht sich die Navigation immer in die linke Ecke wenn ich rauszoome.
    Kann mir jemand einen Tipp geben, wie ich die Navigation links davon hinbekomme?
    In dem schwarzen Balken sollte Weiss der Text sein und über dem Inhalt ist noch ein Bild, jetzt möchte ich noch die Navigation links davon.

    Hier noch mein html und css codes:

    html:
    <head>
    <link href="css.css" type="text/css" rel="stylesheet"></head>
    <body>

    <div id="Headbild">


    </div>
    <div id="Inhalt_Background">

    <div id="nav">
    <ul>
    <li>a</li>
    <li>b</li>
    <li>c</li>
    <li>d</li>
    </ul>
    </div>

    </div>
    <table>
    <tr>
    <td style="color:white">
    Text
    </td>
    </tr>
    </table>
    </div>

    </body>


    css:

    #nav{
    width: 500px;
    }


    #nav ul {
    float: center;
    }


    #nav li{
    list-style-type: none;
    display: block;
    list-style: none;
    margin-top: 5px;
    border: 1px solid gray;
    background:linear-gradient(0deg, yellow 5%, orange 70%);
    width: 150px;
    }
    #Inhalt{
    text-align: center;
    }
    #Inhalt_Background{
    align:center;
    margin: 0 auto;
    background-color: black;
    opacity: 0.8;
    width: 800px;
    height: 1000px;
    float: center;
    }
    #Navigationlayout{
    }
    #Headbild{
    background: url(bild2.jpg) no-repeat;
    background-position: center;
    height:250px;
    text-align: left;
    font-size: 30px;
    margin-left: auto;
    margin-right: auto;
    width: 800px;
    margin-bottom:15px;