i'm having issue web font on client's website. after hours of researching have come here suggestions.
the font not displaying - in place blank space.
the issue has been reported 2 separate users, using chrome versions 40.0.2214.111 m , 43.0.2357.134 m, unable recreate issue.
i using version 43.0.2357.134 m , not happen me. tested on every version of chrome available through browserstack , unable recreate issue in of those.
a couple more points of interest:
i using 2 web fonts in website. both stored locally on web server , called in same way. 1 of them displays (hurme geometric sans 2) other 1 doesn't (hurme geometric sans 2 semibold).
everywhere font used in css, multiple fallback fonts specified, yet not render in of fallback fonts - shows blank space.
css:
@font-face { font-family: 'hurme geometric sans 2'; src: url('../fonts/hurmegeometricsans_no2_4_regular-webfont.eot'); src: url('../fonts/hurmegeometricsans_no2_4_regular-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/hurmegeometricsans_no2_4_regular-webfont.woff2') format('woff2'), url('../fonts/hurmegeometricsans_no2_4_regular-webfont.woff') format('woff'), url('../fonts/hurmegeometricsans_no2_4_regular-webfont.ttf') format('truetype'), url('../fonts/hurmegeometricsans_no2_4_regular-webfont.svg#hurmegeometricsans2_regularrg') format('svg'); font-weight: normal; font-style: normal; } @font-face { font-family: 'hurme geometric sans 2 semibold'; src: url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.eot'); src: url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.eot?#iefix') format('embedded-opentype'), url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.woff2') format('woff2'), url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.woff') format('woff'), url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.ttf') format('truetype'), url('../fonts/hurmegeometricsans_no2_5_semibold-webfont.svg#hurme_geometric_sans_2sbd') format('svg'); font-weight: normal; font-style: normal; } h1 { font-family:'hurme geometric sans 2 semibold','hurme geometric sans 2', helvetica, arial, sans-serif; font-size:38px; line-height:38px; text-align:center; text-transform:uppercase; margin-top:0px; padding-top:0px; margin-bottom:0px; padding-bottom:0px; font-weight:normal; } so, reiterate major points:
- the font "hurme geometric sans 2 semibold" displays on 99.99% of browsers, doesn't display @ in cases (blank space shown).
- the fallback fonts specified not utilised.
- i have been unable recreate issue have seen screenshots of users.
- the other font used on site, "hurme geometric sans 2" not have problem. in cases "hurme geometric sans 2 semibold" doesn't display, "hurme geometric sans 2" still does.
Comments
Post a Comment