-
Notifications
You must be signed in to change notification settings - Fork 247
New issue
Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.
By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.
Already on GitHub? Sign in to your account
IE7 blank page if using font-face #30
Comments
K, can't reproduce this anymore. Probably 1.0.3b fixed this already. |
I can reproduce the exact same thing with 1.0.3b and it's not just IE7 for me. IE8 as well. @thasmo try clearing your cache and reloading the page and it'll likely turn "invisible" again. Problem seems to only be on initial load before stylesheet is cached. |
Here is some more details about this problem that I dig during my attempts to find out a reason of blank screen in IE8:
Also I found a way to workaround this problem until it will (hopefully) be fixed in code: Moving @font-face declarations directly into HTML page solves the problem of blank screen |
I used the solution suggested above (@font-face declarations in the HTML head) and it seems to have corrected the issue for me as well. I am using 1.0.3b and was serving fonts from a separate stylesheet. |
Also experiencing this issue with real IE8 (not IE9 in IE8 dev mode) and 1.0.3b. Hoping to see this fixed in the next build. Thanks, |
I'm having this issue right now, but only with IE8. I'm using selectivizr with Drupal, and the problem only happens when I use Drupal's "Aggregate JavaScript files" feature. The only fix I've found is moving the @font-face styles to the head as mentioned above. |
I can also confirm this bug and that the workaround fixes it for me. Tested with IE8 on Windows XP, Vista and Windows 2003 server. |
I have also confirmed this bug, on a CMS running a soup of Javascript: Modernizr, Repond.js, Selectivizr, Mootools (for Joomla) and jQuery (for MBP3.0). Symptom the same on all Windows XP machines with IE8 that we could get our hands on: on http://cosd.com IE8 would crash whenever reloading the page: the screen would freeze and smear the content vertically if the scrollbar was used, or display solid white if in the middle of redrawing the page or responding to a change in screen width. I tried disabling every one of the above javascripts, and some in groups. I also tried the working versions distributed together on http://selectivizr.com/tests/respond/ and back-revved versions working together on other sites. Nothing worked until we moved the @font-face rules into the Since then I've realised the working sites I saw that use custom fonts are using Google Web Fonts style sheets which are not evaluated due to selectivizr's cross-domain restriction. That would be another workaround I think: to host a font stylesheet on a related domain (like the web designer's). For now we think the |
I too hope this can be fixed. |
I'm also pretty keen to see this fixed. I'm using the head workaround for now but am also concerned about how much extra weight this is adding in terms of un-cached CSS as well as how it's affecting workflow (not being able to declare @font-face in existing stylesheets / Sass partials). |
Also an issue for me. Please fix :) |
got this problem too, even in IE8. fix seems to work. |
We are having this issue (or a similar variant) in IE7. Doesn't happen when testing on IE8 for us, but happens on IE7 only, until Selectivizr is removed. The reason I say it may be a similar variant because what happens for our team most of the time is that the page loads with the fonts rendered as normal, but after a few seconds the page flashes blank, then re-renders without the fonts using only the local fallback fonts. Also, the repo we are working on is using a font-face service like Typekit (but not Typekit), rather than straight local CSS font-face calls, FWIW. |
Just had the same issue. 1.0.3 didn't help, so I'm still declaring my font face in a block before my linked stylesheets and selectivizr include. Great plugin, but disappointing that this issue is occurring in IE8. |
Same issue here. |
I'm having the same issue in IE8 with the Omega 4 theme for Drupal. It uses the selectivizr v1.0.3b version. |
I'm also using the Omega 4 theme for Drupal and having the same issue in IE7 and 8. |
In order to prevent @font-faces to disappear on ie8 (please die soon)
|
Loading all web fonts via JS rather than CSS seems to side step this bug entirely. For any Drupal folks reading this thread, see my comment here for a more detailed solution (it's in the Omega theme issue queue but can apply to any theme, Drupal 6, 7 or 8): https://drupal.org/node/2083203#comment-7862697 For a tidy, CMS agnostic approach to loading web fonts from various sources via JS, see this library: |
So, I guess this bug was just abandoned all together. I still get this screen in IE7 and IE8 when using @font-face. We're using 1.0.3b. |
It looks like everybody else got this fixed by using inline styles in the head, but that didn't solve it for me (using 1.0.3b). This may be because I included the google font stylesheets in a The only thing that stopped the white screen from appearing at times was removing Selectivizr altogether. |
confirm getStyleSheets called in ContentLoad - work for me ( if cache empty also work ) |
Reading around the referenced issue posted by AlxMedia above it seems that this may only be an issue when viewing IE8 via developer tools and not necessarily an issue when viewing a site in "native" IE8. Can anyone else confirm this to be the case? I thought I'd tested this but it's been a while and currently don't have access to native IE8. |
I can confirm that native IE8 in Windows XP does suffer from the issue, but I believe it to be related to |
Had same problem as described in earlier comments, but managed to fix this to have the font includes directly in the html page. |
We just ran into this issue. Interesting fix @joeyhoer, we didn't try that. We had font-face directives in a LESS file, so it was all included into a master LESS. We fixed it as well by moving those declarations outside into the @dixhuit we were having regular business users (non developers) running into the blank page in their IE8, on Windows 7 machines. I ran into it myself several times. It was especially bad for people that were farther away from our data center, like South Africa or other remote locations. |
Hello!
When using a font-face CSS definition, selectivizr has a bug which results in IE7 not showing any page elements. It seems like they're invisible.
The following CSS is triggering the bug:
@font-face {
font-family: 'Colaborate-Thin';
src: url('colaborate-thin.eot');
src: url('colaborate-thin.eot?iefix') format('eot'),
url('colaborate-thin.woff') format('woff'),
url('colaborate-thin.ttf') format('truetype'),
url('colaborate-thin.svg#webfont8nzqAfDm') format('svg');
}
It seems it has to do something with the functions
parseStyleSheet() or resolveUrl(), but I'm not sure.
Regards,
Thasmo
The text was updated successfully, but these errors were encountered: