juliusmk: Unterschiedliche Darstellung trotz identischem CSS

Hallo,

knabber seit ner Weile an folgendem Problem:

juliusmk [dot] de [slash] relaunch ist meine zukünftige Webseite. Die linke Spalte ist das Menü, die rechte der Inhalt, in meinem Stylesheet wie folgt beschrieben:

#menu {
float: left;
width: 150px;
padding: 0.1em;
}

#content_menu {
position: relative;
margin: 0;
padding: 1.2em;
min-height: 500px;
}

#inhalt {
margin-left: 150px;
padding: 0.1em;
}

.content_inhalt {
position: relative;
margin: 0;
padding: 1.2em;
min-height: 500px;
}

Wie man also sieht, absolut identisch - bis auf das Float. Wenn ich jetzt den Punkt bei content_inhalt durch eine Raute ersetze (wie es ja bei content_menu der Fall ist), dann zerlegt er mir das Layout, zieht den Inhalt über den Rahmen etc. Warum? Ich versteh es einfach nicht?

Außerdem sind beide contents mit einem min-height: 500px versehen und das Menu weigert sich einfach, es umzusetzen. Warum?

Danke für Eure Hilfe!

  1. Hi juliusmk,

    .content_inhalt {
    position: relative;
    margin: 0;
    padding: 1.2em;
    min-height: 500px;
    }

    Wie man also sieht, absolut identisch - bis auf das Float. Wenn ich jetzt den Punkt bei content_inhalt durch eine Raute ersetze (wie es ja bei content_menu der Fall ist), dann zerlegt er mir das Layout, zieht den Inhalt über den Rahmen etc. Warum? Ich versteh es einfach nicht?

    Lies dir bitte den Unterschied zwischen Formaten für Klassen und Individualformaten durch, mit dem . formatierst du eine Klasse, mit dem # an seiner Stelle formatierst du eine ID - du hast aber kein Element mit der ID content_inhalt in deinem HTML-Code, folglich greift das CSS nirgendwo.

    Viele Grüße aus Kanada,
      ~ Dennis.

    1. Danke Euch beiden, das wars wohl, das mit dem min-height frisst er jetzt auch. *freu*

      Hi juliusmk,

      .content_inhalt {
      position: relative;
      margin: 0;
      padding: 1.2em;
      min-height: 500px;
      }

      Wie man also sieht, absolut identisch - bis auf das Float. Wenn ich jetzt den Punkt bei content_inhalt durch eine Raute ersetze (wie es ja bei content_menu der Fall ist), dann zerlegt er mir das Layout, zieht den Inhalt über den Rahmen etc. Warum? Ich versteh es einfach nicht?

      Lies dir bitte den Unterschied zwischen Formaten für Klassen und Individualformaten durch, mit dem . formatierst du eine Klasse, mit dem # an seiner Stelle formatierst du eine ID - du hast aber kein Element mit der ID content_inhalt in deinem HTML-Code, folglich greift das CSS nirgendwo.

      Viele Grüße aus Kanada,
        ~ Dennis.

  2. Raute steht für ID
    Punkt für Class

    und du hast folgendes gemacht:
    <div id="content_menu">
    <div class="content_inhalt">

    damit du auch bei content_inhalt eine Raute setzen kannst must du es als ID definieren, also: <div id="content_inhalt">