Ciao D@vide, grazie per la risposta ^^
ateam.altervista.org/
Questo è il link del sito.
Se guardi la pagina che ti si apre (la Home), la scritta è visualizzata bene (The A-Team!) e quella e la visualizza SEMPRE bene su IE e su FF
Se guardi nelle altre pagine, i titoli (che dovrebbero avere il font del titolo della home) invece non lo sono.
C'è qualcosa di sbagliato nel mio codice secondo me, perchè se una pagina non fa problemi e l'altra si ci sarà un motivo...
Questo è il foglio di stile che uso per formattare
@font-face {
font-family: Blockography;
src: url(/Fonts/Blockography.eot);
src: local('Blockography'), url(/Fonts/Blockography.ttf), format('truetype');
}
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: medium;
font-family: Tahoma, Arial, sans-serif;
vertical-align: baseline;
text-indent: 0;
}
html {
padding: 0 15px;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
body {
line-height: 1;
color: white;
background: #303030 repeat fixed;
}
ol, ul, li {
list-style: disc outside;
color: white;
margin: 0;
padding: 0px 2px;
border: 0;
outline: 0;
font-weight: inherit;
font-style: inherit;
font-size: medium;
font-family: Tahoma, Arial, sans-serif;
vertical-align: baseline;
text-indent: 0;
}
/* tables still need ‘cellspacing="0"’ in the markup */
table {
border-collapse: separate;
border-spacing: 0;
}
caption, th, td {
text-align: left;
font-weight: normal;
}
strong {
font-weight: bold;
padding: 0;
}
u {
text-decoration: underline;
padding: 0;
}
cite {
font-style: italic;
padding: 0;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: "";
}
blockquote, q {
quotes: "" "";
}
img
{
-ms-interpolation-mode: bicubic;
}
a:link {text-decoration: underline; color: #FFFF00;padding: 0;}
a:visited {text-decoration: underline; color: #FFA500;padding: 0;}
a:hover {text-decoration: underline; color: #FFA500;padding: 0;}
/*Titoli*/
.MainTitle {font-family: Blockography; font-size: 100px; color: white; font-variant: small-caps; padding: 0;}
.LargeTitle {font-family: Blockography; font-size: 60px; color: white; font-variant: small-caps; padding: 0;}
.MediumTitle {font-family: Blockography; font-size: 45px; color: white; padding: 0;}
.SmallTitle {font-family: "Arial Black", sans-serif; font-size: 20px; color: #FFFF00; padding: 0;}
.Date {font-family: Tahoma, Arial, sans-serif; font-size: large; font-weight: bold; color: #FFFFFF; padding: 0;}
Se dai un'occhiata all'ultima parte ci sono le classi che uso per i titoli:
.MainTitle è quella che uso per la Home
.LargeTitle per i titoli nelle altre pagine
.MediumTitle per i titoli dei paragrafi nelle altre pagine
Ti ricordo che @font-face è una feature di CSS3 e essi non sono completamente supportati da tutti i browser. Inoltre ti ricordo che è rischioso usarlo comunque anche su Firefox perché non saprai come le nuove versioni lo supporteranno e se lo supporteranno.
@font-face era una specifica di CSS2.1 e ripresa anche nei CSS3.
Il supporto è garantito da: Internet Explorer 4 e versioni successive, Firefox 3.5, Safari 3.1 e versioni successive, attivabile anche si Google Chrome.
Quindi non è così eretica e visionaria l'idea di poter utilizzare qualcosa di più accativante dell'Arial nei propri siti.
In ogni caso, su IE fino a ieri funzionava, quindi non è un problema di browser.