Ostatnio robiąc testy działania projektu pod Joomla, zostałem zadziwiony tym, że pod Operą formularz z aiContactSafe leży i kwiczy, dokładnie nie ładuje się z powodu błędów JS. Po kilkugodzinnych oględzinach, usuwaniu i minimalizowaniu kodu, natknąłem się na ostrzeżenia o nie rozpoznanych czcionkach ładowanych przez @font-face. Po krótkiej zabawie okazało się, że psują czcionki EOT, czyli te robione dla IE. Prostym więc stało się, że trzeba ładować je tak aby były niewidoczne dla Opery.

Do tej pory zawsze wszystkie czcionki ładowałem do jednego pliku CSS i robiłem ich wersje normalną i dla IE, o tak:

@font-face {
    font-family: Czcionka1;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka.ttf);
}
@font-face {
    font-family: Czcionka2;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka2.ttf);
}
@font-face {
    font-family: Czcionka1IE;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka.eot);
}
@font-face {
    font-family: Czcionka2IE;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka2.eot);
}

A następnie używałem ich przez definiowanie najpierw normalnej, a potem IE czcionki:

elem{
    font-family: Czcionka1,Czcionka1IE, Verdana;
}

Do tej pory nie wiem dlaczego tylko pod Operą powodowało to błędy, ale przyniosło to takie usprawnienia, że przestałem ładować EOTy do każdej przeglądarki, oraz to, że mogłem zacząć definiować czcionki tylko jedną nazwą, gdyż w stylach tylko dla IE, nadpisuje tylko nazwę:

<link rel="stylesheet" href="/fonts/fonts.css" type="text/css" />
<!--[if IE ]>
<link rel="stylesheet" href="/fonts/fontsIE.css" type="text/css" />
<![endif]-->
/*** PLIK fontsIE.css ***/

@font-face {
    font-family: Czcionka1;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka.eot);
}
/*** Stosowanie(tylko jedna nazwa czcionki, zadnych dubli IE) ***/

elem{
    font-family: Czcionka1, Verdana;
}

To już jakieś usprawnienie!:-) Jednak doszedłem do wniosku, że lepiej stosować coś innego. Z uwagi, że to co odtwarzają przeglądarki z osadzanych czcionek, nie zawsze jest takie jakbyśmy chcieli, postanowiłem najpierw próbować załączyć oryginalną czcionkę a dopiero potem osadzaną.

/*** PLIK fonts.css ***/

@font-face {
    font-family: CzcionkaWEB;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka.ttf);
}
/*** PLIK fontsIE.css ***/

@font-face {
    font-family: CzcionkaWEB;
    font-style:  normal;
    font-weight: bold;
    src: url(czcionka.eot);
}
/***  Stosowanie - 'Czcionka' to oryginalna nazwa czcionki w systemie ***/
elem{
    font-family: Czcionka, CzcionkaWEB, Verdana;
}

Jak widać nawet błędy Opery się do czegoś przydają:-) Obyście jak najmniej utykali!