Search code examples
cssgoogle-chromebusiness-catalyst

CSS not working in Chrome


The CSS is not loading for this page of the website I am working on: http://www.thesanfordcenter.net/sanford-center. It happens only in Chrome, but is not a caching issue as the same problem is happening in Chrome on another computer and I have cleared all browsing and cache history in my browser.

It does seem to be working correctly in FF and IE. The sub pages on this site, which use a different template seem to be working fine.

I am not sure what it is that is causing this. Any help would be appreciated.


Solution

  • Comparing css links between the page you referenced and sub-pages, you have a "media" attribute in your link:

    Problem:

    <link href="/stylesheets/css_Sanford.css" rel="stylesheet" type="text/css" media="only screen and (min-device-width: 481px" />
    

    Working:

    <link href="/stylesheets/css_Sanford.css" rel="stylesheet" type="text/css" />
    

    Try removing the "media" attribute and it should work fine.

    More specifically, it does not appear that "only" is a valid operating for the media attribute. See this W3Schools page for details.