About CSS stylesheet files
Browsers refuse to apply a stylesheet sent with another type when the page is in standards mode or the server sends nosniff. The classic error, “Refused to apply style because its MIME type ('text/html') is not a supported stylesheet MIME type”, nearly always means the CSS URL returned an HTML page: a 404 page or a single-page-app fallback.
File signature
CSS has no fixed signature: it is text without a magic number, so validate uploads by parsing the content rather than by checking bytes.
Serve .css with the right Content-Type
Content-Type: text/css; charset=utf-8
text/css css;
AddType text/css .css
AddCharset UTF-8 .css
@css path *.css
header @css Content-Type "text/css; charset=utf-8"
curl -sI https://example.com/file.css | grep -i '^content-type'
# Content-Type: text/css; charset=utf-8
Set the type in code
res.set('Content-Type', 'text/css; charset=utf-8');
import mimetypes
mimetypes.add_type('text/css', '.css') # if your system doesn't know it
mimetypes.guess_type('file.css')[0] # 'text/css'
mime.AddExtensionType(".css", "text/css; charset=utf-8")
w.Header().Set("Content-Type", "text/css; charset=utf-8")
Accept .css uploads
<input type="file" accept=".css,text/css">
The accept attribute only filters the file picker; users can still choose another file. Listing the
extension as well as the type matters, because operating systems don’t always report the type you expect.
Related types
More web
.mjs , .svg , .wasm , .webmanifest , .rss , .vtt . Look up any extension or type with the MIME type lookup.
Sources
Spotted a mistake? Email hello@devtoolsmith.com and we’ll fix it.
Frequently asked questions
What is the MIME type for .css files?
text/css. It is a text format, so add the character set: "Content-Type: text/css; charset=utf-8".
Why does my server send the wrong Content-Type for .css?
Web servers pick the type from the file extension using a table (mime.types in nginx and Apache). If .css is missing from that table, they send a default such as application/octet-stream or text/plain. Add the mapping as shown on this page, then check the response with "curl -sI".
How can I check that a file really is CSS?
CSS has no fixed file signature, so the extension and content are all you have. Check that the content is what you expect, for example by parsing it, before trusting an upload.