Categories: Report an Issue :

Chrome not loading stylesheet

Showing 1-27 of 27 messages
Chrome not loading stylesheet ziggymello 7/1/09 10:10 PM
Lonely Planet's forum, Thorn Tree (http://www.lonelyplanet.com/thorntree/index.jspa), is not displaying correctly in Chrome.

The css file that is not loading is:  link rel="stylesheet" type="text/css" href="/thorntree/themes/LonelyPlanetNew/resources/style.css" /

I have investigated the following with no success. Can anyone help?

(1) Apparently a  common Chrome problem occurs where positioning the alternate link underneath the main style sheet link causing it to think (for  some reason) that it is the main css file. In this case it may think it is the RSS link:

link rel="stylesheet" type="text/css" href="/thorntree/themes/LonelyPlanetNew/resources/style.css" /

link rel="alternate" type="application/rss+xml" title="RSS"  href="http://www.lonelyplanet.com/thorntree/rss/rssmessages.jspa?categoryID=1" /

The solution according to http://jeremyjarratt.com/2008/09/03/google-chrome-obeys-alternate-css/ is to place the RSS link above the style sheet link.

RESULT: No change


(2) There have been similar problems that suggest Mime type problems:

http://getsatisfaction.com/hedgehoglab/topics/chrome_css_mime_type_misinterpreted

http://code.google.com/p/chromium/issues/detail?id=7448

However the header and footer style sheets (core.css/global.css) are displaying correctly which suggests that it is not.

RESULT: I cannot see any evidence that the mime type is being misinterpreted and no logical reason as to why that particular style sheet would be targeted


(3) The style sheet link for the main body of thorn tree

  link rel="stylesheet" type="text/css" href="/thorntree/themes/LonelyPlanetNew/resources/style.css" /

vs the style sheet link to core and global styles

  link rel="stylesheet" href="http://static.lonelyplanet.com/static-ui/style/global.css" type="text/css" media="screen,projection"/

  link rel="stylesheet" href="http://static.lonelyplanet.com/static-ui/style/core.css" type="text/css" media="screen,projection"/>

The only difference is stating the media type: media="screen,projection"

RESULT: Adding media="screen,projection" made no difference

(4) Also chrome should not be case-sensitive, but I looked into the folder name: LonelyPlanetNew & the fact that the link is relative rather than absolute

RESULT: Changing the case, file name and file path made no difference. However, when I saved the homepage & css file to my desktop and linked the local css file it worked fine. This suggests an environment problem

(5) Doctype. The Document type is strict html. Changing this may work.

RESULT: Changing the doctype had no affect. However removing the doctype fixes the problem, suggesting that something in the css is disagreeing with the doctype or there is some weird environment problem. I removed everything in the css file except the basics and still the same issue.....so no conflict there...??

(6) Charset. The charset may not be interpreted properly:

http://www.google.com/chrome/intl/en/webmasters-faq.html#fontspecs

I added @charset "ISO-8859-1"; and then  @charset "UTF-8";

RESULT: No difference


SUMMARY:

After extensive research and experimentation, everything seems to be in order and it is perplexing as to what the problem is.
Re: Chrome not loading stylesheet Daniel Jeffery 7/9/09 2:17 AM
Hi ziggymello,

I don't know if you are still watching this thread as it is pretty old.

Anyway I had the same problem as you with one of my sites, namely the css not loading in Chrome (it appeared fine in all other browsers).

I was pulling my hair out and tried lots of suggested solutions, checking MIME types (appeared OK), removing/repositioning RSS link, checking charset.

I finally "solved" it although I don't know why it worked.  I noticed on all my other functioning sites, the style sheet filename was default.css, but the problem site's stylesheet was somethingelse.css.  I changed it to default.css and it now works.

I don't really understand why so maybe someone else can explain and in the meantime I hope this helps anyone else going mad trying to solve this issue.
Re: Chrome not loading stylesheet ziggymello 7/19/09 8:43 PM
Thankyou Daniel,

No it is not too late & I am watching. That is quite perplexing. I'll investigate this further over the next couple of weeks and post my result.
Re: Chrome not loading stylesheet itfcfan 9/7/09 1:37 PM
Hi,

This problem is due to the content type the stylesheet is served with.

The other stylesheets (core.css & global.css) are served with the correct content type (text/css) in the http response, but the problematic stylesheet (style.css;jsessionid=*) is served without a content type. Since the current version of Chrome has a stricter interpreation of valid content types for stylesheets, the rules in the file aren't processed. If you want to double check, I recommend using an extension like Firebug or Live HTTP Headers in Firefox to view the content types returned when loading the page.

I'd suggest that the inconsistency on this page is due to the working stylesheets being loaded from a different host (http://static.lonelyplanet.com/) whereas the problematic stylesheet is being loaded from the application server (http://www.lonelyplanet.com/). It looks like that stylesheet is being parsed/modified by the website's application layer, so additional steps would need to be taken to serve the proper content type. This would usually be a one liner of code (explicitly setting the content type to return), but there may well be some rigidity in either their application server or the application itself that prevent this.

Although it is the website that is behaving incorrectly, I should imagine it will be Chrome's behaviour that changes first, because the stricter rules it's applying are at odds with the other browsers, making it appear is if it is "breaking" these sites.

John
Re: Chrome not loading stylesheet ChrisG1238 10/22/09 4:18 PM
2 more solutions for this problem:

- The first characters in the css-file should be:
@charset “UTF-8″;
whithout any space or line-break before. (That solved my problem. Not only utf-8, it's only a example)

- The css-file should be served with the correct content type "text/css" as "itfcfan" has mentioned. This could be easily done with following line in a ".htaccess"-file:
addtype text/css .css

For German, I've wrote a short blog post: http://www.hornblog.de/2009-10-22/css-stylesheet-wird-in-chrome-nicht-angezeigt/
Re: Chrome not loading stylesheet abumohammed 5/20/10 8:54 AM
I had similar issue with chrome not loading css despite FF and IE. I was able to solve it by adding a semi colon at the end my @import statement. I guess chrome is very strict on CSS syntax. if any error found the whole CSS does not load. this is just my personal conclusion,still someone from chrome team has to confirm it.
Thanks
~yelatia
Re: Chrome not loading stylesheet gyb 5/28/10 8:56 AM
Hi,

I have a similar problem on the site I'm building and none of the solutions above seem to work.
The problem is the following: when Chrome loads the page (with empty browser cache) it doesn't load the CSS file (it doesn't load any CSS file at all). But when I reload the same page it loads the CSS file and displays the site content correctly.

I do have alternate stylesheets defined (so that it's possible to toggle between them using a neat javascript trick) but I don't see how that would cause problems. The site checks out as W3C valid (xhtml 1.0 transitional) and works perfectly under any other browsers I tried (IE x, Opera 10.5, Firefox 3.6.3, Safari 4.0.5 etc). I duplicated the default css as default.css, made sure that the css file's first characters are correct and that they served with the correct content type, followed what the first poster tried. I also gave a shot to Firebug to see what could go wrong but no luck..

Details:
Site: http://hps.elte.hu/~gyepi/xhome.html
Chrome version: Mac OS X, 5.0.375.55 (up-to-date).

Thanks for any suggestions!
Re: Chrome not loading stylesheet gyb 5/28/10 9:15 AM
EDIT: disabling AdThwart (Version: 0.9.7) solves the problem mentioned before. Apparently there is some incompatibility with the CSS elements injected by AdThwart.
Re: Chrome not loading stylesheet gyb 5/28/10 10:12 AM
EDIT2: I contacted the developer of AdThwart who promptly added a workaround. Add to your filters the AdThwart extra filters, update, and voila. Hope this resolves problems for others as well!
Re: Chrome not loading stylesheet JohnAlden 8/4/10 5:55 AM
I was just troubleshooting a similar problem.  The .Net application worked fine in IE, but chrome refused to use the css.  After digging around on the application server and watching sessions in Fiddler, I stumbled upon a setting in the MIME type.  The website had a MIME type of ".*" set to "application/octet stream".  Once this setting was removed, the style sheet was used properly by Firefox and Google Chrome.  Hopefully this will help anyone that encounters this problem.
Re: Chrome not loading stylesheet clinkety 9/22/10 8:32 AM
There seems to be absolutely no rhyme or reason to this. On a WordPress installation, the CSS is only partially loading on the front end, in the WP admin itself, it loads on the "Dashboard" page but not on any other pages.

There are a variety of other websites I visit that don't load the CSS. They were displaying correctly before Chrome auto-upgraded me to 6. I'm running Chrome on a Mac.
Re: Chrome not loading stylesheet soulfulwriter 11/22/10 9:31 PM
Ok, I am lost here. The Stylesheet of any site just doesn't show up properly in my Chrome browser, some images show up, others like function buttons and stuff like that don't. How do you resolve this problem without having to get into each visited site's css code to fix it? I haven't found an answer regarding this issue and it seems to me that here the discussion centers on having stylesheet problems with just one or two particular websites. My problem is with all and any site I visit via Chrome browser. Is there a solution for this? I've looked at the browser settings and I don't find anything regarding stylesheets or any setting that should alter the functioning this way. Am I missing something here?

I would appreciate your willingness to enlighten me and show me the way of the gurus.

Thank you so much.
Re: Chrome not loading stylesheet soulfulwriter 11/22/10 9:31 PM
Re: Chrome not loading stylesheet soulfulwriter 11/22/10 9:32 PM
Re: Chrome not loading stylesheet soulfulwriter 11/22/10 9:40 PM
Re: Chrome not loading stylesheet ereides 12/18/10 10:57 PM
After a research and reading all this thread I find the solution, in my case at least, my site is displayed in hebrew language and seems that because I saved the .css file as ANSI this was the cause of the problem, when I changed the saved file to unicode everything works well in chrome and IE. I think that you can try it and report if this is the real solution.
Re: Chrome not loading stylesheet bsmith95610 3/14/11 2:04 AM
I was having the same issue I am running two sites one in asp.net and one in classic asp.  What fixed the .net one for me was I had a css file using an import tag pointing to another css file like so @import url("style.css"); I removed that from my css file then added <link rel="stylesheet" type="text/css" href="/css/style.css" title="Screen CSS stylesheet" /> to my master page and that fixed it.  I think it is due to chrome not knowing the datatype.

For the classic asp site I had to add the doctype (<!DOCtype html PUBLIC "-//W3C//Dtd XHTML 1.0 transitional//EN" "http://www.w3.org/tr/xhtml1/Dtd/xhtml1-transitional.dtd">) to the top of my master page.

I hope this can help someone else.
Re: Chrome not loading stylesheet Chr1zt1an 3/24/11 7:54 PM
Thanks bsmith95610 !, that solved the problem i was having :)
Re: Chrome not loading stylesheet iemjaved 7/7/11 12:54 AM
I had a problem with modalpopupextender not showing up properly in chrome. The css was not applying to modal popup or background window. My css file and pages were in same folder.I solved my problem by simply moving my css file to different folder and changing my css link in master page. Hope this can help someone else too.
Re: Chrome not loading stylesheet Commandrea 8/29/11 11:37 PM
I was using:  @-moz-document url-prefix() {
    * { font-weight: 100; }
    h1, h2, h3, h4, h5, h6 { font-weight: 400;
    }

which broke the code and Safari nor Chrome would read it. Took it out- added   *{font-weight:100;}
Re: Chrome not loading stylesheet RVGoddess 11/23/11 9:07 AM
I solved the problem by writing the full address of the style sheet:

<link href="http://www.mysite.com/CSS/style.css" rel="stylesheet" type="text/css" />
Re: Chrome not loading stylesheet ev46 5/17/12 1:45 PM
with the latest Chrome, make sure there is a forward slash before the href file name unless you specify the full URI to the css file.  
Re: Chrome not loading stylesheet MTCH 8/20/12 1:03 AM
I had the same issue with one of 5 css files. The problem was that the site was https (SSL) and the css with an external absolute href not. I was able to handle it that also the css link has https and it workes.
Re: Chrome not loading stylesheet AlfredoAntaria 11/30/12 1:06 AM
I found a solution in my case. I forgot to safe the css file as a UTF-8 file.
At first it was saved as an ansi file under visual studio.
So check it if the file is saved properly to
At Visual Studio : [File/Advanced Safe Options –> encoding:“Unicode (UTF-8 with signature)”]
At Notebook : [File/safe as .. -> Coding:”UTF-8”]
Re: Chrome not loading stylesheet Denise Cook 7/10/13 12:45 PM
This worked for me!  Thank you so much!!!
Re: Chrome not loading stylesheet Diane Redfern 7/24/13 3:10 PM
Typing the full address of the style sheet on my home page worked for me. Thanks
Re: Chrome not loading stylesheet Thomas Kroll 10/10/13 12:52 PM
I know this response is to a VERY old thread, but I thought I'd add my 2 cents.

I actually have to do a javascript check for the browser and do a local redirect to the appropriate file(s).  Seems Chrome can't load external style sheets, but displays them when they are inline (in the <head>).  

It's twice the work, but well worth it.  And now-a-days with all the script languages out there, it's just some basic browser checking and code redirection.  Shouldn't be a major issue.  

You can Google how to check browsers, I won't go into that here.

Just wanted to offer what worked for me.  :)

More topics »