external css file loading but not being applied [closed]

Question

Wetware Error

It was a typo - there were 2 different css files with similar names and I was linking to one on one site and another on the other

Apologies from a muppet :(

Closed

I have the following line in an html head section:

<link rel="stylesheet" href="http://files.hypernumbers.com/redesign/frontpage.css">

When I view this page from the domain hypernumbers.com it loads fine and then is applied.

But when I view the same page from the domain hypernumbers.dev it loads (Firebug and Chrome tools show me that the CSS file is there) but it isn't applied to the page

Is there some sort of domain precedence/sub-domain thing going no that I don't know about?

Update

Tried it in Opera where it doesn't load in either hypernumbers.com or hypernumbers.dev...

Answer 1

This is a pretty old question, but since it's the top result in Google I'll put my solution here.

I was having the same issue, my CSS files were accessible and were being downloaded by the browser, but they weren't actually being applied. I could browse to the CSS manually just fine, but both Firefox and Chrome weren't applying them.

This was my link tag:

<link href="/static/css/bootstrap.css" rel="stylesheet" type="text/css">

Looks fine, that's the correct path... I even remembered to set the type, but no dice.

As is turns out, my web server was forcing the content-type on CSS files to application/octet-stream. So even though I specified type in the link tag, both Firefox and Chrome were seeing the wrong content-type from the server and refusing to apply the stylesheets.

If you're using Firefox with Firebug installed you can see the content-type your server is sending on the "Net" tab.

In my case, using Lighttpd, the fix was to add ".css" => "text/css" to mimetypes.assign like so:

mimetype.assign     = ( ".html" => "text/html",
                        ".txt" => "text/plain",
                        ".jpg" => "image/jpeg",
                        ".png" => "image/png",
                        ".css" => "text/css",
                        "" => "application/octet-stream" )

Hope this saves someone from a couple hours of Googling and head scratching.

Answer 2

It might be a bit of a crazy guess, but if you add in the attribute type="text/css" does that make any difference? Also, what's the encoding on the CSS file and the html document?

As a last check, have you considered downloading the file and making a local copy? Just to ensure that there's nothing between your network and Hypernumbers causing issues?