Dominik Schäfer: CSS-Hack für Safari-Versionen

Hallo allerseits,

gibt es einen CSS-Hack, mit dem man zwischen den Safari-Versionen unterscheiden kann? Habe nämlich Darstellungsfehler, die ausschließlich in Safari 2 Mac auftreten, in Version 3 stimmt alles.

Dank und Gruß,
Dominik

  1. gibt es einen CSS-Hack, mit dem man zwischen den Safari-Versionen unterscheiden kann? Habe nämlich Darstellungsfehler, die ausschließlich in Safari 2 Mac auftreten, in Version 3 stimmt alles.

    Einen reinen CSS-Hack gibt es nicht, soweit ich weiß. Du kannst jedoch zumindest den Useragent abfragen. Wir machen das aktuell so, haben es jedoch noch nicht im Livebetrieb testen können:

    $agent = stristr($_SERVER['HTTP_USER_AGENT'], 'Safari');
    if ($agent != '') {
       $version = substr($agent, 7, 3);

    // Initial release of Safari 3 has version 523
       // modified Safari 2s sometimes have version 999 in order to run on
          Leopard
       if ($version < 523 || $version == 999) {

    // Safari 2
          $_safaristyle = '<link rel="stylesheet" type="text/css"
          media="screen" href="/css/safari2.css" />';
       }
       else {

    // Safari 3 and above
          $_safaristyle = '<link rel="stylesheet" type="text/css"
          media="screen" href="/css/safari.css" />';
       }
    }

    Viele Grüße!
    _ds

    --
    »Das Schlimmste, was mir, der Frau Karrenbauer und Barbara Eligmann heute passiert ist, war die Wiederholung vom großen Promi-Buchstabiertest.«
    - Das kleine Seitenschwein, Mir und Frau Karrenbauer
    1. if ($version < 523 || $version == 999) {

      Hm.. Nachtrag. Vielleicht doch lieber so:

      if (($version > 0 && $version < 523) || $version == 999) {

      Für den Fall, das im Useragent an der geprüften Stelle nur Bullshit steht, nicht jedoch die Versionsnummer. Denn dann soll vermutlich das Stylesheet für Safari 3 benutzt werden, und nicht das für Safari 2.

      Viele Grüße!
      _ds

      --
      »Ich hasse Zahnarztbesuche, verachte Spritzen und Bohrer und war in diesem Moment der Hauptdarsteller einer Black Sabbath-Show, der ich ganz bestimmt nicht sein wollte.«
      - Das kleine Seitenschwein, Porsche fahren
    2. Moin Moin!

      Fang mal damit an:

      http://centricle.com/ref/css/filters/?highlight_columns=true
      http://www.info.com.ph/~etan/w3pantheon/style/csshub.html
      http://www.tantek.com/CSS/Examples/

      Alexander

      --
      Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so".
      1. Oops, sollte eine Antwort auf das Original-Posting werden ...

        Alexander

        --
        Today I will gladly share my knowledge and experience, for there are no sweeter words than "I told you so".
        1. Vielen Dank für die Antworten!

  2. Hallo,

    gibt es einen CSS-Hack, mit dem man zwischen den Safari-Versionen unterscheiden kann? Habe nämlich Darstellungsfehler, die ausschließlich in Safari 2 Mac auftreten, in Version 3 stimmt alles.

    Ich kenn Dein Problem nicht, aber eventuell kannst Du Dein Darstellungsproblem auch andersherum lösen, mit generellen Regeln für Safari 2 und damit alle Browser und speziellen Regeln für Safari 3 (und Opera), die die generelle Regel überschreibt. Wenn ja, dann würde ich an CSS 3 Media Queries denken, die beherrscht Safari [link@title=seit Version 3] nämlich (Beispiel).

    Das sähe dann so aus:

    ~~~css @media only all {
          div {
              /* Spezielle Regeln * /
          }
      }

      
    Mit der [@media](http://de.selfhtml.org/css/formate/einbinden.htm#media)-Regel wird ein spezieller Bereich eingeleitet, der nur gilt, wenn der Medientyp "all" zutrifft. Das klingt beknackt – gilt es doch für alle Medien und alle Browser, auch schwächere – aber dafür ist das Schlüsselwort "only" zuständig. CSS 3 Media Queries sind ja eine aufgepimpte Variante der reinen Selektion nach Medientypen aus CSS 2.1 und HTML 4. Dort gibt es den Medientyp "only" nicht. Und in CSS 3 Media Queries werden solche Abfragen mit "only" so interpretiert, als stände "only" da nicht.  
      
    Die Konsequenz ist, dass Browser, die nur @media-Regeln nach CSS 2.1 kennen, diese nicht verarbeiten, weil sie "only" nicht kennen. Browser, die CSS 3 Media Queries kennen, verarbeiten diese Regel aber, dank "all" für alle Medientypen. Das wäre eine Methode, um sehr moderne Browser und damit auch Safari 3 auszuwählen. Das hat aber auch den Nachteil, dass derzeit damit Opera und in Zukunft weitere Browser ausgewählt werden; die hypothetischen speziellen CSS-Regeln müssten dann dort keinen Kollateralschaden verursachen.  
      
    ...  
      
    Geschickter wäre es vermutlich, zu gucken, was die Darstellungsprobleme in Safari 2 verursacht und dort ohne Kollateralschaden drumherum zu arbeiten. Das heisst, Du müsstest da Ursachenforschung betreiben. Mit dem eigentlichen Darstellungsproblem hier nachzufragen, wäre das, was ich gemacht hätte.  
      
    ...  
      
    Mal ganz abgesehen davon, dass Safari 2 eh so langsam verschwinden sollte. Es gibt Safari 3 ja nicht nur für Mac OS X 10.5 „Leopard“ sondern auch inzwischen auch für den Vorgänger Mac OS X 10.4.11 „Tiger“ und Mac-Nutzer sind eigentlich ein recht updatefreudiger Haufen, so dass sich das Update auf 10.4.11 auch unter den Leopard-Verweigerern stark verbreiten wird. Aber ich würde dennoch versuchen, diese Unschönheit zu beseitigen, ja.  
      
      
    Tim