Resource interpreted as stylesheet but transferred with MIME type text/html (seems not related with web server) Resource interpreted as stylesheet but transferred with MIME type text/html (seems not related with web server) google-chrome google-chrome

Resource interpreted as stylesheet but transferred with MIME type text/html (seems not related with web server)


i'd like to start by understanding the problem

Browsers make HTTP requests to servers. The server then makes an HTTP response.

Both requests and responses consist of a bunch of headers and a (sometimes optional) body with some content in it.

If there is a body, then one of the headers is the Content-Type which describes what the body is (is it an HTML document? An image? The contents of a form submission? etc).

When you ask for your stylesheet, your server is telling the browser that it is an HTML document (Content-Type: text/html) instead of a stylesheet (Content-Type: text/css).

I've already checked my myme.type and text/css is already on css.

Then something else about your server is making that stylesheet come with the wrong content type.

Use the Net tab of your browser's developer tools to examine the request and the response.


Using Angular?

This is a very important caveat to remember.

The base tag needs to not only be in the head but in the right location.

I had my base tag in the wrong place in the head, it should come before any tags with url requests. Basically placing it as the second tag underneath the title solved it for me.

<base href="/">

I wrote a little post on it here


I also had problem with this error, and came upon a solution. This does not explain why the error occurred, but it seems to fix it in some cases.

Include a forward slash / before the path to the css file, like so:

<link rel="stylesheet" href="/css/bootstrap.min.css">