Forums

CSS file not loading, MIME type

Hi, I'm facing an issue deploying a website made with Django. I can't get the CSS files to load on my page; the browser console shows the following error message:

Refused to apply style from 'http://rickymaggio.pythonanywhere.com/static/css/main.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

In the 'static' directory i have also a js (javascript) and an 'image' directory, and all the scripts and images from there are working. My CSS file (main.css) starts with:

@import url(//db.onlinewebfonts.com/c/9897812c6013649bd7a0c3d2efb4c834?family=HK+Grotesk);

@font-face {font-family: "HK Grotesk";
    src: url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.eot");
    src: url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.eot?#iefix") format("embedded-opentype"),
        url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.woff2") format("woff2"),
        url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.woff") format("woff"), url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.ttf") format("truetype"),
        url("//db.onlinewebfonts.com/t/9897812c6013649bd7a0c3d2efb4c834.svg#HK Grotesk") format("svg");
}

body {
    background-color: #252934;
    font: 300 11px/1.4;
}

#page {
    width: 100%;
    height: 100%;
    position: absolute;
}

.container {
    width:100%;
    will-change: contents;

[edit by admin: formatting]

When I visit the URL for the static file in question, I get a 404 not found error, so that might be the cause of the problem. I see you have set up a static route on the "Web" page; did you follow the instructions on the Django static files help page?

thank you Giles, with your comment i just noticed that the route of my file was /CSS/main.css. Windows is not case sensitive, so in the test phase i didn't have problems, but Linux is the opposite.

Ah, that makes sense. Glad to hear you worked it out!

Refused to apply style from 'https://elpizo.pythonanywhere.com/static/shop/css/custom.css' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

i am also getting the same error... and also when i try to collectstatic i am getting following error PermissionError: [Errno 13] Permission denied: '/home/ewmm09ixhazq'

You're probably not serving the css file, so you're getting an HTML 404 page. See https://help.pythonanywhere.com/pages/DjangoStaticFiles/ and https://help.pythonanywhere.com/pages/StaticFiles/ and https://help.pythonanywhere.com/pages/DebuggingStaticFiles/

You're getting permission denied because that directory does not exist. Make sure you are collecting your static files into a directory that does exist and is in your home directory.

Refused to apply style from 'https://vikrantydv.pythonanywhere.com/home/Vikrantydv/Portfolio/personal/static/personal/src/style.css%20' because its MIME type ('text/html') is not a supported stylesheet MIME type, and strict MIME checking is enabled.

I am also getting the same error...

error log file showing following error: 2023-01-12 06:55:08,866: Not Found: /home/Vikrantydv/Portfolio/personal/static/personal/images/shape.png 2023-01-12 06:55:08,880: Not Found: /home/Vikrantydv/Portfolio/personal/static/personal/images/name.jpeg

It still looks like you didn't fix the static files mappings -- please follow the help pages my colleague posted above.