CSS Hacks

Aus der Kategorie: CSS
Sonntag, 30. Mai 2010 (Zuletzt aktualisiert am Mittwoch, 16. Juni 2010)

CSS HacksWer kennt es nicht? Der eine Browser stellt die selbe Website anders dar als der andere. Im folgenden sind ein paar sogenannte "CSS Hacks" aufgelistet. Diese erleichtern den Umgang mit verschiedenen Browsern.

Für den Firefox Explorer gibt es keinen Hack der bewirken würde, dass eine Anweisung nur für diesen Browser gültig ist. Daher empfiehlt es sich ein Layout erst mal nur für den Firefox zu entwickeln. Mit den unten genannten Hacks lässt sich das Layout dann für die anderen Browser angleichen.

Prefix Hacks

Mit Prefixen lassen sich einzelnde Browser ansteuern.

.styleClass {
  margin: 5px; /* Alle Browser */
  *margin: 10px; /* Nur IE7 */
  _margin: 15px; /* Nur IE6 */
}

 

Nach Oben

Star HTML / Star Plus HTML

Alle Browser:

.styleClass {
  margin: 5px;
}

IE6:

* html .styleClass {
  margin: 5px;
}

IE7:

* + html .styleClass {
  padding : 1.0em 0.6em;
}

Nach Oben

Conditional Comments

Mit Conditional Comments lassen sich einzelne Zeilen HTML Code für bestimmte Browser deaktivieren.

<!--[if Bedingung]> Anweisungen <![endif]-->

Bedingungen können dabei folgende Werte sein:

Wert Funktion Beispiel
!IE wenn kein Internet Explorer <!--[if !IE]>
IE wenn Internet Explorer <!--[if IE]>
IE 6 wenn Internet Explorer Version 6 <!--[if IE 6]>
IE 7 wenn Internet Explorer Version 7 <!--[if IE 7]>
IE 8 wenn Internet Explorer Version 8 <!--[if IE 8]>
mso wenn Microsoft Office <!--[if mso]>

Quelle: wikipedia.org

 

Nach Oben

Meta Tag

<meta http-equiv="X-UA-Compatible" content="IE=EmulateIE7" >

Mögliche Werte:

Wert Beschreibung
IE=8 Web page supports IE8 mode, which is also called "IE8 standards mode."
IE=7 Web page supports IE7 mode, which is also called "IE7 standards mode."
IE=5 Web page supports IE5 mode, which is also called "quirks mode."
IE=EmulateIE8 If the Web page specifies a standards-based DOCTYPE directive, the page supports IE8 mode; otherwise, it supports IE5 mode ("quirks mode").
IE=EmulateIE7 If the Web page specifies a standards-based DOCTYPE directive, the page supports IE7 mode; otherwise, it supports IE5 mode ("quirks mode").
IE=Edge Web page supports the highest mode available to the version of Internet Explorer used to display the page. This option is generally intended for testing purposes.
Quelle: msdn.microsoft.com