Heute habe ich mir an einem CSS-Layout die Zähne ausgebissen:
Nachdem ich den doctype des HTML-Dokuments von transitional nach strict geschaltet habe, um das nervige Box-Model des Internet Explorers auszutricksen (Tabellen mit width="100%" in einem div sind in Firefox, Safari und Opera so breit wie gewünscht, nur der Internet Explorer zerschiesst das ganze Layout), gab es einen vertikalen Abstand von ca. 4 Pixeln zwischen einzelnen divs wie #header und #content.
Nach stundenlangem Pröbeln und mehreren erfolglosen Google-Suchen zum Thema fand ich endlich den massgeblichen Hinweis:
This time we set the vertical-align property of the object element to bottom. This aligns the bottom of the object with the bottom of the line box, eliminating the small gap we saw earlier.
Quelle: That mysterious gap under images and embedded objects
Ehrenwort? Wirklich? JA! Nachdem ich im Stylesheet
#header img {vertical-align:bottom;}
postuliert hatte, verschwand die nervige Spalte zwischen der Kopfzeile und dem Inhalt der Web-Site. Herueka!
