Joker: Divs mit "Luft" nebeneinander

Ich habe einen großen div Bereich erstellt. 1024 Breit und 802 Hoch. Darin ist ein Header-Bereich mit 138 Höhe und 1024 Breite.darunter ist ein Menu-Bereich und ein Bereich wo der Inhalt steht.

Das Menü ist: width:176px, height 596px, float:left.
Der Inhaltsbereich: width:845px, height: 596px.

Zwischen diesen Beiden Bereichen sollte ein Abstand von 10 px sein. Das sollte doch mit margin-left10 px im Menü-Bereich so sein. Jedoch funktioniert es so leider nicht. Wie krieg ich zwischen den Beiden bereichen etwas "Luft"?

mfg

  1. Yerf!

    Das Menü ist: width:176px, height 596px, float:left.
    Der Inhaltsbereich: width:845px, height: 596px.

    Zwischen diesen Beiden Bereichen sollte ein Abstand von 10 px sein. Das sollte doch mit margin-left10 px im Menü-Bereich so sein.

    Sollte das nicht eher ein margin-right sein?

    Ansonsten, falls margin nicht hilft kannst du ja mal padding ausprobieren.

    Gruß,

    Harlequin

    --
    <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
    1. Sollte das nicht eher ein margin-right sein?

      gut geraten, kommt aber drauf an, ob das menu vor oder nach dem anderen element im Quelltext kommt :)

      [code=html]
      <div id="container">
        <div id="inhalt">inhalt</div>
        <div id="menu">menu</div>
      </div>
      [/code]

      [code=css]
      #container {
        width: 510px;
      }

      #inhalt {
        float: right:
        width: 400px;
        margin-left: 10px;
      }

      #menu{
        float: right:
        width: 100px;
      }
      [/code]

      btw: margin-left UND float-left führen zu einem Internet-Explorer-Bug, hierbei muss zusätzlich display: inline gesetzt werden (double float margin left bug)

      1. Yerf!

        Sollte das nicht eher ein margin-right sein?

        gut geraten, kommt aber drauf an, ob das menu vor oder nach dem anderen element im Quelltext kommt :)

        Deswegen hatte ich ja seine CSS-Angaben mit zitiert. Da ist die Rede von einem float-left für das Menü und keinem float für den Content.

        Gruß,

        Harlequin

        --
        <!--[if IE]>This page is best viewed with a webbrowser. Get one today!<![endif]-->
        1. Deswegen hatte ich ja seine CSS-Angaben mit zitiert. Da ist die Rede von einem float-left für das Menü und keinem float für den Content.

          natürlich erscheint das logisch - aber von der reihenfolge im css auf auf die reihenfolge im html zu schließen ist etwas gewagt - ich hab schon viele helden gesehen :D

  2. @@Joker:

    Ich habe einen großen div Bereich erstellt. 1024 Breit und 802 Hoch.

    Das ist schlecht. Da dürfte bei den allermeisten Nutzern horizontales Scrollen erforderlich sein, was alles andere als nutzerfreundlich ist.

    Gestalte das Layout flexibel; molilys SELFHTML-Weblog-Eintrag Optimierung für Bildschirmauflösungen gibt dazu etliche Hinweise.

    Live long and prosper,
    Gunnar

    --
    „Das Internet ist ein großer Misthaufen, in dem man allerdings auch kleine Schätze und Perlen finden kann.“ (Joseph Weizenbaum)