muskelbody hat geschrieben:soweit gefällt es mir auch, aber der firefox stellt mir nicht die ganze seitenbreite mit der hintergrundfarbe der navbar dar (nur soweit wie etwas drinsteht). im internet explorer geht das wunderbar.
Erste Regel beim Umgang mit CSS: Zum Entwickeln nicht den IE benutzen, schon gar nicht einen vor Version 7; alles bis einschließlich Version 6 ist so fehlerbehaftet, dass du dich auf wenig bis gar nichts verlassen kannst. Nimm immer erst einen ordentlichen Browser (so ziemlich jeder andere aktuelle) und korrigiere dann letzte Schnitzer im IE, nicht umgekehrt.
Dein aktuelles Problem hängt mit der auf left gesetzten float-Eigenschaft zusammen. Solche Elemente fallen nahezu komplett aus dem Layoutgeschehen heraus, sie haben lediglich noch Einfluss auf Textzeilen (inline-Elemente), diese können um sie herumfließen. Insbesondere keinen Einfluss haben sie aber auf ihre Elternelemente:
Du hast die Hintergrundfarbe in div#navcontainer gesetzt, die dort eingebetteten Listenelemente werden aber mit float:left aus dem Elementfluss herausgenommen. Wegen float:left haben sie keinen Einfluss auf die Größe von div#navcontainer, so dass div#navcontainer genau so hoch ist, wie ein leeres Element nun mal hoch ist: 0 Pixel. Entsprechend siehst du keine Hintergrundfarbe.
Dass der IE diese Regelung nicht beachtet, ist einer seiner bekannteren Fehler hinsichtlich CSS. Diese Regelung mag auf den ersten Blick unpraktisch erscheinen, wie ja gerade hier in deinem Fall zu sehen ist, aber warum das so muss, ist in folgender Grafik zu sehen:
Der schwarz umrandete Kasten steckt zwar HTML-seitig im ersten roten Absatz, wird aber bis in den zweiten roten Absatz hineingezeichnet. Das ist die natürliche Vorgehensweise bei Bildern, die von Text umlaufen werden sollen. Würde der schwarze Kasten seine Höhe seinem Elternelement, dem ersten roten Absatz aufbürden, würde zwischen dem ersten und dem zweiten Absatz eine riesige Lücke entstehen.
Ich hoffe, das ist verständlich dargestellt.
Du kannst das Problem entweder ignorieren (so schlimm ist es ja nicht und im aktuellen IE ist der Fehler AFAIK behoben) oder umschiffen, indem du nicht float:left nutzt, sondern display:inline.
Davon unabhängig ist div#navcontainer überflüssig, Hintergrundfarbe und Elementbreite kann man mit dem gleichen Effekt auch bei <ul> setzen.
Weiterhin solltest du für generell fehlerfreien Code sorgen (siehe
https://validator.w3.org/check?uri=http ... nfo/forum/ ), mit einem defekten Auto eine Reise zu beginnen ist ein denkbar ungünstiger Anfang.
Details zu float, einschließlich obiger Grafik, findest du im
CSS-Standard, Abschnitt 9.5.
