Thomas: Mozilla-Browser unterscheiden Art der CSS-Datei-Einbindung?

Hallo liebe Leute,

Ich bin soeben auf eine Eigenart gestoßen, bei der ein Stylesheet in Mozilla-Browsern (und Opera) nicht wie gewollt (und wie im IE) angezeigt wurde. Nun habe ich lediglich die Dateien sortiert und die Einbindung dieser in HTML geändert. Und schon wird das Stylesheet in allen verwendeten Browsern wie gewünscht angezeigt.

[ zum testen verwendete Umgebung:   Browser:   MS IE 6.0; Opera 8.52; Firefox 1.5   BS:   WinXP SP1   HTML-Header:      <?xml version="1.0"?>      <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"             "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">      ]

Im einzelnen; die alte Einbindung:


<link rel="stylesheet" href="basic.css" type="text/css" media="screen, projection" title="Standard Bildschirm und Projektion-Stil" /> <link rel="stylesheet" href="one_page.css" type="text/css" media="screen, projection" title="Zusatz-Stile für einzelne Seiten" /> <!--[if gte IE 4]>  <link rel="stylesheet" href="msiefix.css" type="text/css" media="screen, projection" title="Standard Bildschirm und Projektion-Stil" /> <![endif]-->

Und nun die abgeänderte Fassung; hier entspricht:

mozilla.css = basic.css msie.css    = basic.css + msiefix.css (Dateien wurden lediglich umbenannt, bzw. ineinander kopiert)


<style type="text/css"> /* <![CDATA[ / @import url(mozilla.css) screen, projection; / ]]> */ </style> <!--[if gte IE 4]>  <link rel="stylesheet" href="msie.css" type="text/css" media="screen, projection" title="Standard Bildschirm und Projektion-Stil" /> <![endif]--> <link rel="stylesheet" href="one_page.css" type="text/css" media="screen, projection" title="Zusatz-Stile für einzelne Seiten" />

Wie kann es sein, dass allein die Art der Einbindung von im Grunde identischen CSS-Dateien die Ausgabe beeinflusst? Verwendet z.B. der Firefox eine andere CSS-Version zum parsen, wenn der die Datei nach einer älteren Syntax eingebunden wurde oder das ganze als XML deklariert ist?

Mmmh, vielleicht hat ja jemand da draußen eine Idee, wie man so ein Verhalten erklären kann.

Mit sonnigen Grüßen aus Potsdam,

Thomas

  1. Wie kann es sein, dass allein die Art der Einbindung von im Grunde identischen CSS-Dateien die Ausgabe beeinflusst?

    Diese Frage wurde bereits kürzlich hier diskutiert:
    https://forum.selfhtml.org/?t=137268&m=892020

    1. Üblicherweise arbeitet der Browser in genau der Reihenfolge, wie es im Quelltext notiert ist - und kann soviel, wie er zum Zeitpunkt des Testens können kann. ;-)

      D.h., der DOM-Baum wird Schritt für Schritt erzeugt, und wenn das Element ein Stylesheet ist, wird das Stylesheet verarbeitet und wenn das nächste Element ein Script ist, wird das Script verarbeitet (was dann schon auf die Stylesheets zugreifen kann), etc.

      Okay, nur steht ja ein und die selbe CSS-Datei (basic bzw. mozilla.css) an der selben Stelle im Quelltext. Nur die Art und Weise der Einbindung ändert sich (von HTML <link> zu CSS @import).

      Ergibt für mich immer noch keinen Sinn...

      Bis denn dann,

      Feeela

  2. Hi,

    <link rel="stylesheet" href="basic.css" type="text/css" media="screen, projection" title="Standard Bildschirm und Projektion-Stil" />

    auf das titke-Attribut solltest Du verzichten.

    <!--[if gte IE 4]>

    spielt zwar hierbei keine Rolle, ist aber Unsinn, da conditional comments erst ab IE 5 eingeführt wurden.

    /* <![CDATA[ */

    spielt zwar auch keine Rolle, ist aber hier übereflüssig.

    @import url(mozilla.css) screen, projection;

    und hier hast Du schließlich keinen title - s.o.

    freundliche Grüße
    Ingo