Hallo,

Das andere Problem ist das Validieren des CSS-Dokuments. Da wird eine Fehlermeldung ausgegeben, die ich nicht ganz verstehe und/oder den Fehler nicht finde:

Nun, das XHTML-Dokument kommt aber ohne Fehler durch den Validierungstest:
http://validator.w3.org/check?uri=http%3A%2F%2Flightbox.telltec.ch%2Fdemo%2Findex.php%3Fgallery%3DOM-Schiff%2520in%2520Genua

Der W3C Markup Validator lügt! Er verwendet nicht einmal einen XML-Parser (und DTD-Validierung ist für XHTML unpassend). Das Markup ist fehlerhaft, aber der W3C-Validator versteht das nicht. Das ist ein bekannter Fehler.

Fragen Sie jemanden, der sich damit auskennt, nämlich den XHTML Schema Validator.

<a href="show.php?album=OM-Schiff in Genua&amp;picture=img-5.jpg"class="portrait">
                                                                ^^^
Da fehlt ein Leerzeichen zwischen den Attributen. Das ist wohl in SGML/HTML erlaubt - der W3C Validator verwendet einen aufgebohrten SGML-Parser -, aber in XML/XHTML nicht.

Mathias

das Problemkind ist die folgende Seite:
http://lightbox.telltec.ch/demo/index.php?gallery=OM-Schiff in Genua

Und zwar seht ihr sicher den footer (#footer) unten, der durch eine 1px #666 dotted linie abgetrennt ist.
Nun möchte ich gerne, dass er nach oben 15px Abstand zu den Photos hat, was ich aber nicht hinbringe. Habe jetzt alles versucht, was mir in den Sinn gekommen ist, ich hoffe ihr habt die zündende Idee.

margin-top von #footer bezieht sich auf die vorige Block-Box, die *nicht* aus dem Elementfluss genommen ist. Das ist konkret #pictures. Schau dir mal dessen Dimensionen an, indem du ihm border:1px solid red gibst. Es hat keine Höhe, da alle Kindelemente float:left haben. margin-top von #footer wirkt zwar, aber zwischen #footer und #pictures sind sowieso mehr als 15px Abstand. Damit margin-top überhaupt eine merkliche Auswirkung hat, müsstest du vielleicht margin-top:1000px angeben. Was du aber willst: margin-top soll sich auf die letzte Zeile der floatenden a-Elemente beziehen. Das kannst du z.B. erreichen, indem du dafür sorgst, dass die float-Boxen eingeschlossen werden und #pictures also alle floatenden a-Elemente wirklich umspannt. Siehe dazu etwa http://aktuell.de.selfhtml.org/weblog/css-spaltenlayout#float-einschliessen. overflow:auto; funktioniert hier zum Beispiel.

Mathias