Verständnisfrage: Klassen innerhalb von IDs

  • Ich habe auf einer Seite ein DIV das mit einer ID versehen ist.


    Code
    1. #div_id {
    2. background: blue;
    3. }


    Der dazugehörige HTML-Code (Auszug):


    HTML
    1. <div id="div_id">
    2. <p>Blablub</p>
    3. </div>


    Innerhalb dieses DIVs habe ich den Paragraphen <p> eine Standardformatierung zugewiesen:


    Code
    1. #div_id p {
    2. width: 80%
    3. }


    definiere ich jetzt eine Klasse mit einer anderen Breite, z.B.


    Code
    1. .lesswidth {
    2. width: 60%;
    3. background: yellow;
    4. }


    Dazugehöriger HTML-Auszug:


    HTML
    1. <div id="div_id">
    2. <p class="lesswidth">Blablub</p>
    3. </div>


    dann wird dies ignoriert, also komplett - nicht nur die Breite, sondern alle Anweisungen. Warum ist dies so? Bzw. ist das immer so, oder mache ich irgendwo etwas falsch?


    Ändere ich das CSS wie folgt:


    Code
    1. #div_id p.lesswidth {
    2. width: 60%;
    3. background: yellow;
    4. }


    dann wird es (natürlich?) auch angezeigt, nur würde ich besagte Klasse gerne flexibler einsetzen, ohne mich zu wiederholen.


    (Die Anweisungen sind nur Platzhalter um hier nicht den vollständigen CSS-Code angeben zu müssen)

    "Quis custodiet ipsos custodos?" Juvenal


    Die archaische Kultur von Minos hat dem Minotaurus alljährlich ihre Kinder geopfert, um Sicherheit zu gewinnen. Eine demokratische Kultur, die ihre Prinzipien dem Terrorismus in den Rachen wirft, handelt nicht anders. H. Prantl in NZZ Folio 09/07


    Webseiten & Datenschutz - eine kurze Zusammenfassung

  • Ahh, danke. Also - wenn ich das richtig sehe - gibt es keine Möglichkeit in entsprechendem obigen Konstrukt dem <p> noch eine Klasse zuzuweisen?

    "Quis custodiet ipsos custodos?" Juvenal


    Die archaische Kultur von Minos hat dem Minotaurus alljährlich ihre Kinder geopfert, um Sicherheit zu gewinnen. Eine demokratische Kultur, die ihre Prinzipien dem Terrorismus in den Rachen wirft, handelt nicht anders. H. Prantl in NZZ Folio 09/07


    Webseiten & Datenschutz - eine kurze Zusammenfassung

  • steffenk: Danke! Wieso genau sollte ich das spezifisch definieren?


    Vielleicht ist auch einfach mein Grundansatz falsch:


    Ich habe mehrere Unterseiten die jeweils auf einem von drei "Container-Divs" aufbauen, die per ID definiert sind. Innerhalb dieser Container-DIVs sehen die einzelnen Elemente recht ähnlich aus. Daher hätte ich gerne Klassen, die ich für alle drei Fälle anwenden könnte.

    "Quis custodiet ipsos custodos?" Juvenal


    Die archaische Kultur von Minos hat dem Minotaurus alljährlich ihre Kinder geopfert, um Sicherheit zu gewinnen. Eine demokratische Kultur, die ihre Prinzipien dem Terrorismus in den Rachen wirft, handelt nicht anders. H. Prantl in NZZ Folio 09/07


    Webseiten & Datenschutz - eine kurze Zusammenfassung

  • es geht um folgendes: In der Klasse definierst Du eine Breite. In der ID auch, also geht ID vor. Es ist was anderes wenn Du sowas benutzt:
    .rot {color:red;}
    und Du machst keine color-Anweisung in der ID, dann greift die Klasse immer wenn sie eingesetzt wird. Wenn Du spezifisch definierst, weisst Du das es immer greift.