Don P: Übersicht im Quelltext

Hallo leute,

Mein erstes richtiges stylesheet ist gerade in der Mache und ich stoße auf seltsame "Probleme", die eigentlich keine sind, aber vielleicht hat ja jemand eine bewährte Methode entwickelt, um die Übersicht im Quelltext zu behalten.

In Fällen, wo mehrere Style-Definitionen logisch zusammenghören, kann man sie anscheinend nicht einfach verschachteln, sondern muss alle separat aufführen. Zur Zeit habe ich z.B. folgendes:

  
div#Coup {  
  
  color: green;  
  font-size: 0.91em;  
  float: left; width: 5em;  
  margin: 0; padding: 0;  
  border: 1px dashed green;  
  visibility: hidden;  
}  
  
div#Coup table {  
  
  text-align: center;  
  margin: 0 auto;  
  cursor: pointer;  
  }  
  
div#Coup table .noir {color: white; background-color: black;}  
div#Coup table .rouge{color: black; background-color: red;}  
div#Coup table .vert {color: black; background-color: green;}  
div#Coup table .gris {color: black; background-color: silver;}  

Obwohl alles nur für div#Coup und Kinder gilt, ist es für meinen Geschmack nicht nicht richtig gruppiert bzw. gruppierbar. Viel lieber wäre mir so etwas:

  
div#Coup {  
  
  color: green;  
  font-size: 0.91em;  
  float: left; width: 5em;  
  margin: 0; padding: 0;  
  border: 1px dashed green;  
  visibility: hidden;  
  
  table {  
  
    text-align: center;  
    margin: 0 auto;  
    cursor: pointer;  
  
    .noir {color: white; background-color: black;}  
    .rouge{color: black; background-color: red;}  
    .vert {color: black; background-color: green;}  
    .gris {color: black; background-color: silver;}  
  }  
}

Aber das funktioniert nicht. Wie notiert ihr denn Zusammengehöriges, so dass man in umfangreicheren stylesheets nicht den Überblick verliert?

Gruß, Don P

  1. Hi,

    Viel lieber wäre mir so etwas:

    div#Coup {
      [...]
      table {
        [...]
      }
    }

    
    >   
    > Aber das funktioniert nicht.  
      
    Tja, diese Syntax von Verschachtelungen ist halt nicht definiert.  
      
    
    > Wie notiert ihr denn Zusammengehöriges, so dass man in umfangreicheren stylesheets nicht den Überblick verliert?  
      
    Vielleicht koennen dir diese beiden Artikel ein paar Tipps geben:  
    [Creating Sexy Stylesheets](http://www.thinkvitamin.com/features/design/creating-sexy-stylesheets)  
    [XHTML- und CSS-Code-Richtlinien bei GMX](http://meiert.com/de/publications/articles/20060326/#toc-css)  
      
    MfG ChrisB