Lieber Simon P.,

Du versteigst Dich da in PHP-Konstrukte, anstatt Dein eigentliches Problem, das Markup, zu verstehen und zu verbessern.

Ich habe was im Internet gefunden, was evtl. das schafft was ich möchte, ich poste hier mal den Text. Leider verstehe ich den noch nicht ganz (ist ziemlich kompliziert, wie ich finde).

Mir scheint, hier wird PHP-seitig "nachgeholfen", damit der Browser Dinge so darstellt, wie Du das möchtest. Das kann der aber auch ohne PHP ganz gut, wenn Du die clientseitigen Technologien (HTML&CSS) vernünftig(!!) einsetzt - ohne PHP. Meine Fiddles dazu hast Du schon gesehen?

Naja, kann ich nun meine html Dateien einfach die Endung .php geben und alles läuft wie gehabt?

Mach es so: Eine HTML-Datei enthält keinen PHP-Code und endet auf ".html". Eine Datei, die PHP-Code enthält, hat die Endung ".php".

inculde benutze ich leider öfters, daher wüsste ich nicht, wie ich das html technisch lösen müsste. (include benutze ich z.B. für eine Neuigkeiten-Spalte am rechten rand, die in allen meinen HTML Dateien ist, damit ich nicht in 20 HTML Seiten meine Neuigkeit einfügen muss)

Dazu ist PHP ja gedacht!

ja, ich denke, ich könnte meinen CSS-Code geringer halten, aber ich denke, dass würde die Übersichtlichkeit hemmen.

Übersichtlichkeit "hemmen"? Nein. Je weniger Klassen Du benutzt, desto klarer wird das Ganze. Man sieht im Code dann sofort, welche Zusammenhänge welche Klassen oder IDs haben, da man die Selektoren passend im Code gruppieren kann. Vergleiche einmal:

.box { border: 1px solid black; }  
#boxes .box { display: none; }  
.box .current { display: block; }

Im obigen Beispiel werden zwei Klassen und eine ID verwendet. Wie diese jeweils zusammenhängen wird nicht klar. Jetzt das Gegenbeispiel:

#box li dl { border: 1px solid black; display: none; }  
#box li:hover dl { display: block; }

Meiner Ansicht nach ist klar, dass hier alles an einem Element mit der ID "box" hängt. Seine Nachfahren-Elemente <li> und <dl> werden nach einer ":hover"-Eigenschaft entsprechend gesteuert.

Somit muss ich ja immer ersteinmal nachvollziehen, wo was ist, bzw. die Struktur nachvollziehen .

Eben! Genau darum geht es doch!

Aber sobald meine CSS-Dateien wachsen, werde ich umsteigen. Bei diesem Projekt ist das erstmal nicht notwendig glaube ich. (8kb größte CSS)

Warum zuerst ungünstig und unpraktisch, wenn man einen Hinweis bekommt, wie man das vermeiden kann?

Übrigens habe ich nun auch wieder etwas dazugelernt und kann Dir nun (noch immer ohne JavaScript-Einsatz!) eine Version mit Buttons bieten.

Liebe Grüße,

Felix Riesterer.