Список CSS хаков

Список CSS хаков
/* хак только для IE8 Only */
.myClass {
color:red\0/; /* красный */
padding:70px\0/; /* отступ 70px только для Internet Explorer 8 */
}

/* IE 6 Only */
* html .myClass {
    ...
}

/* All except IE6 standards */
.myClass {
    property /**/: value;
}

/* Firefox & IE 7, и выше */
html>body .myClass {
...
}

/* Modern browsers only (not IE 7) */
html>/**/body .myClass {
    ...
}

/* IE 7 Only */
*:first-child+html .myClass {
...
}

/* Firefox Only */
@-moz-document url-prefix() {
    .myClass {
        ...
    }
}

/* Opera Only */
noindex:-o-prefocus, .MyClass {
    color:red;
}

/* IE7 Only */
div[class^="myClass"] .myClass2 {
    ...
}

/* IE7 only */
*+html .myClass {
    ...
}

/* hack for Opera <=9 */
html:first-child .myClass {
    ...
}

/* Firefox, Opera, Konqueror, Safari */
*|html .myClass {
    ...
}

/* IE8 beta 2 only (?)*/
html:first-child .myClass [attr|=a-b] {
    ...
}

/* IE5/Mac only */
/*\*//*/ .myClass { property: value; } /**/

/* Gecko only */
.myClass:not([attr*=""]) {
    ...
}

/* Opera
@media all and (min-width: 0px) {
    html:first-child .myClass {
        ...
    }
}

/* Safari only */
.myClass:not(:root:root) {
    ...
}

/* Safari 3.0 and Chrome only */
@media screen and (-webkit-min-device-pixel-ratio:0) {
.myClass {
....
}
}

/* Chrome browser */
body:nth-of-type(1) .myClass {
...
}

/* Safari browser css hack */
body:first-of-type .myClass {property:value;}

CSS для Explorer

<!--[if IE]>
    ... если Internet Explorer ..
    <link href="ie-fix.css" type="text/css" rel="stylesheet">
<![endif]-->

<!--[if IE 6.0]>
    ... если IE6
<![endif]-->
    
<!--[if IE 7]>
    ... если IE7
<![endif]-->

<!--[if gte IE 5]>
    ... если IE5+
<![endif]-->

<!--[if lt IE 6]>
    .. если ниже IE 6
<![endif]-->

<!--[if lte IE 5.5]>
    ... если ниже или равно IE 5.5
<![endif]-->

<!--[if gt IE 6]>
    ... если выше IE 6
<![endif]-->

Полупрозрачность фона в IE, Firefox, Opera

.myClass {
    background-color:#000;    
    -moz-opacity:.82; /* Firefox */
    opacity:.82; /* Opera */
    filter:alpha(opacity=82); /* IE */
}

Убрать лишний padding в button в Firefox

button::-moz-focus-inner {
border: 0;
padding: 0;
}

Chrome/Firefox ... ?

button {
-webkit-border-fit: lines;
}

Комментариев нет


Оставить комментарий