I am creating a form and serve it on my localhost with a port of 3000.
Everything works fine except my browser cannot show the CSS code in my browser and I got this error
Refused to apply style from 'http://localhost:3000/Semantic-UI-master/dist/semantic.min.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
What happened? When I clicked the html file, the CSS is working. I am so confused
Try using the following snippet
<link
rel="stylesheet"
type="text/css"
href="http://localhost:3000/dist/semantic.min.css"
/>
It seems that your trying to include the stylesheet with text/html
Related
The occurence seems to happen at completely random intervals
Accompanied by message in Chrome console: Resource interpreted as
Document but transferred with MIME type application/octet-stream:
"<url>"
It only happens when loaded from disk cache - if a cache refresh is
forced then it displays in the Chrome as expected
Currently the CSS file is hosted on sirv.com - this may or may not be
significant
Here is the HTML code used to load the CSS:
<link rel="stylesheet" href="<url>" media="all">
Remove media="all" and it will be solved <link> is itself used for loading.
The media attribute specifies what media/device the target resource is optimized for.
The default is always media="all" so you don't need to specify it again
In my express application I included the CSS file like this.
<link rel="stylesheet" href="\public\css\style.css">
You can see my project structure here:
https://www.screencast.com/t/bkMH5Xmrz
but it throws this error:
Refused to apply style from 'http://localhost:3000/public/css/style.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.
I have tried different paths of the css file. It is a simple file. nothing other than:
#jumbo {
background: #2980b9;
}
Any help is appreciated.
I have this problem and maybe I'm not the only..
If I test my website on FF, Chrome, Safari, IE7, IE8 is perfect.
On IE9 (standard view) It doesn't load CSS files. If I switch on Compatibilty view it works fine...
How can I show the CSS on the standard view as well?
Thanks
IE9 is known to reject stylesheets which are not sent using "text/css" MIME type. This is a new security enhancement, but it's catching a few people off guard. Is your CSS file dynamically generated? Make sure its getting passed as 'text/css'.
More info: http://blogs.msdn.com/b/ieinternals/archive/2011/03/27/http-406-not-acceptable-php-ie9-standards-mode-accepts-only-text_2f00_css-for-stylesheets.aspx
Another try:: It's not just 'text/css' in the doc that needs to be correct, you need to make sure your local IIS is sending it with the proper headers. "If a style sheet is ignored due to an incorrect MIME-type, your site may fail to render as expected. Text, images, or other features may lack the desired styling. If a style sheet is ignored because it does not bear the correct MIME-type, a notification will be logged in the IE9 F12 Developer Tools console."
http://msdn.microsoft.com/en-us/library/gg622939%28VS.85%29.aspx
IE9 Not applying linked style sheets
I'm assuming your local web server is running IIS. If so, just map the .css file extension to the "text/css" MIME type. Like this...
In IIS v7.x:
Click "MIME Types". You should see a list of file extensions and the associated MIME type.
There should be an entry for the ".css" extension with MIME type = "text/css".
If not, add it by right-clicking anywhere on the list -> Add... -> type in the ".css" extension and "text/css" MIME type.
In IIS v6:
Right-click the server node -> Properties -> "MIME Types...". You should see a list of file extensions and associated MIME the type.
There should be an entry for the ".css" extension with MIME type = "text/css".
If not, add it by clicking "New..." -> type in the ".css" extension and the "text/css" MIME type.
Likely a typing error in the way you include the stylesheet. Is the URL correct, and is the tag closed properly?
We got this kind of problem with a web project, and the trick was to force IE9 to emulate the website/application
as it was IE8.
To avoid to use IE9's compatibilty mode,put into the code this tag
after the tag like this :
< head>
< meta http-equiv="X-UA-Compatible" content="IE=8">
...
< /head>
be sure to put it as the first tag after <head>, if not it doesn't work
I was also facing the same problem, then I moved my css file to static server(or any other domain) and used the new url.
It worked for me, see if this can solve the problem for you too.
I fixed this issue by setting the encoding at the top of my stylesheet
#charset "UTF-8";
I have 2 CSS files as below. style.css is getting 304 Not Modified. But default.css is always getting 200 OK. Why is default.css not being cached?
<h:outputStylesheet library="css" name="default.css"/>
<h:outputStylesheet library="css" name="style.css"/>
I have tried including number of external multiple CSS files into XHTML .I always go with the basic approach to insert CSS into XHTML.I insert the following lines on the index page of your project. It always works fine.
<link rel="stylesheet" type="text/css" href="file1.css" />
<link rel="stylesheet" type="text/css" href="file2.css" />
It is possible that the default.css style is being provided by the server with some sort of document header that prevents caching. This may be out of your control, but if not you could inquire if the server has some specific rule(s) via htaccess or another configuration that prevents the browser from caching (or caching for a very short time).
If default.css is a dynamically generated document, the header could also be created dynamically by the language that creates the actual css document on the server.
There are tools like Fiddler and browser plugins like Live HTTP Header that allow you to inspect the headers of a file requested by the browser.
The browser itself can also have caching turned off but if two unique files with the same extension are acting differently it's probably not a browser setting.
Is there any way of pulling in a CSS stylesheet into FireFox 2 or 3 that is not a static file?
Bellow is the code we are using to pull in a stylesheet dynamically generated by a CGI script.
<link rel="stylesheet" href="/cgi-bin/Xebra?ShowIt&s=LH4X6I2l4fSYwf4pky4k&shw=795430-0&path=customer/DEMO/demo1.css" type="text/css">
/cgi-bin/Xebra?ShowIt&s=LH4X6I2l4fSYwf4pky4k&shw=795430-0&path=customer/DEMO/demo1.css
Note that the URL above that pulls in the CSS does not end with .css rather the parameters do.
Is the Content Type from the server the correct one for the file that is served up?
Content-type: text/css
why isn't this working?
Double check that the response header for the cgi script has
Content-Type: text/css
The extension doesn't matter but you should make sure the content type is "text/css".
I've done the same thing in the past - a former employer's site uses a link tag much like yours, and works fine in FF2 at least (I just checked it, though I tested it in FF when we added that link). If it's not working, I'd suspect it's something about the generated CSS file rather than the importing page. The consensus appears to be the Content-Type from the server may be wrong.
Your server procs (like the CGI) run first, don't they? Seems to me that that link tag will only pull in a file that exists already.
So what I'd do is put a server tag (my lang's ASP/ASP.Net, but you could use PHP or anything, really) in the href.
Like so:
<link rel="stylesheet" type="text/css href="<% =getStylesheetPath() %>" media="all">
Give that a shot.