[CSS] Conent anpassung

  • Hey, ich bin gerade dabei eine kleine Homepage für mich zu schreiben.. dabei hab ich ein folgendes Problem.


    Die Menü leiste ist links und der Conent mittig... sobald ich das fenster kleiner mache vom web browser bleibt das Menü immer links aber es schiebt sich unter den Conent drunter...



    Hier 2 Screens damit man versteht was ich meine. Die Bilder zeigen einmal den Browser in klein und einmal in gross.


    gcr-reallife.com/uhuugugu/klein.png


    gcr-reallife.com/uhuugugu/gross.png


    Hier der Conent Code:
    #content
    {
    background: #FFF;
    border: 2px solid #000000;
    border-radius: 8px;
    opacity:0.6;
    }


    und Menü:
    #menu
    {
    list-style: none;
    position:absolute;
    margin-left: 1cm;
    margin-top: 6.8cm;
    }


    Hoffe ihr könnt mir bei meinem Problem weiter helfen...


    mfg WeeDy' Zeus.

  • <div id="menu"">
    <!-- Menupunkt 1 -->
    <li><a href="index.php" accesskey="1" title="">Startseite</a></li>
    </div>


    <div id="page">
    <div id="content">
    <div class="post">
    <!-- <h2 class="title"><a href="#"></a></h2> -->
    <div style="clear: both;">&nbsp;</div>
    <div class="entry">


    TEXT


    </div>
    </div>
    </div>
    </div>

  • Wenn beide untereinander dargestellt werden sollen musst du eine Breite festgeben. Am besten arbeitest du mit Prozentangaben =)


    Gibst du den beiden Containern eine Breite von 100% können sie, wenn sie floated left sind nicht aneinander vorbeirutschen, es sei denn du stellst die Position auf absolut =)

  • Hab beiden jetzt float:left; gegeben... sobald das fenster kleiner mache rutscht der conent ganz nach unten unter das menu ?? wenn ich es groß lasse sitzt der conent ganz oben


    Klar - Weil die beiden DIV-Elemente zu breit sind um nebeneinander angezeigt werden zu werden.


    Such in Google nach responsivem Layout, da wird alles ausführlich erklärt oder du wartest noch, dann schreib ich dir eine genaue Anleitung zu deinem Problem - Meine Zeit ist gerade aber ziemlich knapp.

  • Du hast ein " zu viel.
    Ist zwar nicht der Auslöser, aber trotzdem falsch.

    HTML
    <div id="menu"">


    und beide brauchen

    CSS
    position:relative

    Hauptsache ist ja immer, dass du es verstehst und das es funktioniert. Es bringt nichts, wenn du einen Code hast den du nicht verstehst, und noch weniger bringt es was wenn du einen Code hast der nicht tut. Naja, und wenn beides zusammen kommt, dann wirds lustig.