header("Content-type: text/css"); is working in Firefox and Chrome, but in Internet Explorer 9 it shows up as 'text/html'

Question

header("Content-type: text/css"); works in Firefox, Chrome and other, but not in Internet Explorer 9. I am not sure what's up.

In Chrome and Firework it shows the style sheet if I open it in its own tab and it's being applied to the page.

In Chrome under Network in the developer tools it says the type is text/css and the status is 200.

In Internet Explorer 9, it wants to download the style sheet if I open it in its own tab and it's not being applied to the page.

In the F12 developer tools you can click on network, start capturing and refresh the page. It shows the Style.css.php. The type is text/html and the result is 406.

This is in the head:

<link rel="stylesheet" type="text/css" href="/assets/css/style.css.php" media="screen" />

Request headers:

Key Value
Request GET /assets/css/main.css HTTP/1.1
Accept  text/css
Referer http://10.0.1.5/
Accept-Language en-US
User-Agent  Mozilla/5.0 (compatible; MSIE 9.0; Windows NT 6.1; WOW64; Trident/5.0)
Accept-Encoding gzip, deflate
Host    10.0.1.5
Connection  Keep-Alive
Cookie  PHPSESSID=*Hidden*

Response headers:

Key Value
Response    HTTP/1.1 406 Not Acceptable
Date    Fri, 01 Apr 2011 10:12:42 GMT
Server  Apache/2.2.14 (Ubuntu)
Alternates  {"main.css.php" 1 {type application/x-httpd-php}}
Vary    negotiate
TCN list
Keep-Alive  timeout=15, max=100
Connection  Keep-Alive
Content-Type    text/html; charset=iso-8859-1

Northerner

What do you mean "doesn't work"? What's the problem? – Meatiness

It does not load it right, its like no css file is being loaded at all in IE. If i go to the file, it wants to download it and not display it like Chrome and Firefox. – Northerner

Did you try to NOT-send the header? :) – Lacustrine

yeah. The css file is a php file because i check account settings for colors of the toolbar you want. – Northerner

On the page that the style sheet is loaded on, its not styling any elements in IE but style elements in Chrome and Firefox. Hope that makes it more clear. – Northerner

Like, no CSS is applied to the page? – Meatiness

Yeah. No css is applied to the page. – Northerner

Like i have no css file at all. But i know i have one because it works in anything but IE. – Northerner

If you let IE download the CSS file and open it up, what do you see? – Meatiness

Have you tried [Ctrl]+[F5] (forced reload)? – Benjie

If i download it. it shows the css. No php or anything. Just the css file the way it shows up in Chrome. The way it should be. – Northerner

What if you just create a regular CSS file, but give it a .php extension and use it instead? Does that work? – Meatiness

Just did a CTRL F5 and still the same. I tried holding shift and clicking the refreshed button also before i asked the question. I think they both do the same thing tho. – Northerner

Getting rid of the header and keeping the .php made it stop working in Chrome and still didn't work in IE. – Northerner

Also using a regular .css file will work but i want to use .php so it can connect the Database and pull user style settings. – Northerner

I know, I'm just trying to see if it's just the extension messing it up. Try a regual CSS file with a .php extension. – Meatiness

I did do a style.css.php also a Style.php with and without the header – Northerner

if i hit F12 in IE and click on Browser Mode: IE9 and click on IE9 Compatibly mode. I left the document mode at IE9 standards The page loads but the default mode its in is IE9. Not sure if this helps at all. But closing and reopening, its back to being broken. Not a prement fix and i'm sure End users will hate having to make these changes.... Plus i want to take full advantage of Html5 features. – Northerner

Oh neat. in the F12 developer tools you can click on network, start capturing and refresh the page it shows the Style.css.php type is text/html and result is 406. Not sure why its showing text/html when header('Content-Type: text/css'); is set.... – Northerner

IF i capture the network in compatibly mode it shows up as being a text/css file but in regular mode its not. – Northerner

In Chrome under Network in the developer tools it says the type is text/css and the status is 200. So not sure on a fix. – Northerner

I uploaded the design to the web and it works in IE9. If i run it on my local 10.0.1.5 server, it fails in IE9. Works in all other browsers no matter what. Local server and VPS are both the same OS. Same software, basically a clone of each other. One is for testing and one is for production tho. So one to mess around in and other for the public to see. – Northerner

IE9 sends Accept: text/css, while other browsers add * / *. You might have issue with content negotiation, for example mod_negotiate might behave unitended way. Try curl -I -H "Accept: text/css" http://.... – Macadamia

based on the headers that you posted, it looks like the server is sending a text/html response. You are also responding with a 406 instead of a 200. Is there some error happening on the server when IE makes this request? – Hebraize

Answer 1

IE has "No, I'm not kidding about Content-Type" switch:

X-Content-Type-Options: nosniff

BTW: make sure you also send Last-Modified and disable session.cache_limiter in PHP, otherwise browsers will keep reloading the CSS file, which will negatively impact performance.

Morrie

header("Content-Type: text/css"); header("X-Content-Type-Options: nosniff"); or header("Content-Type: text/css;X-Content-Type-Options: nosniff;"); isn't working. Am i applying it right? – Northerner

Also session.cache_limiter is set to nocache. So i just type in off? – Northerner

@Keverw: Don't put two headers in one header() call. session.cache_limiter must be none (but that's performance issue which should not prevent MIME type from working). Use Fiddler2 or such to see what headers are actually sent from your server. – Morrie

I added the headers that IE sees in the question for you. – Northerner

So is this the answer? Nothing on this thread seems to indicate "the answer" – Kingsize

Answer 2

Internet Explorer has a history of trusting the file extension over the MIME type reported by the browser. If you have mod_rewrite available, have your HTML look for a .css file and then create a mod_rewrite rule that pipes that URL to your script.

Alysaalyse

+1; however, it's not only IE that tends to blindly trust file extension (which should be entirely meaningless!) over MIME type. They all do this in a different context – Emmalynne

Answer 3

I have found that using header("Content-type: text/css", true); works for me. It prevents the server from outputing 2 HTTP headers for 'Content-Type'.

Mccain

The second parameter for header() is true by default. – Disagree

@Disagree But for some reason, it worked for me. PHP 7.2.7-0ubuntu0.18.04.2 (cli) – Lohman

Answer 4

Is there any output before the header is sent? BOM in the php file? A carriage return?

If you disabled error reporting, you may not see the error it should trigger.

Try adding ob_start() on top, it will resolve any issue related to headers already sent before any header() call.

If you have a BOM in your UTF8 file, you may want to remove it.

Dike

Answer 5

I think the problem maybe due to mod_security which is serving a 401 error page (HTML) rather than the CSS. Try adding this to an .htaccess file in the web root of your website to see if this resolves the issue.

<IfModule mod_security.c>
    SecFilterEngine Off
    SecFilterScanPOST Off
</IfModule>

Disagree

Answer 6

The article Handle Images/CSS/JS as PHP without httpd.conf Using .htaccess helped me figure out the issue.

You basically do all the same stuff as everyone else mentioned (setting header in PHP, etc.), but also use .htaccess to set the AddHandler param.

<Files my_style.css>
    ForceType application/x-httpd-php
    AddHandler application/x-httpd-php .css
</Files>

This way you can name it with .css and still have PHP parse it.

Hebraize

I also did some server side checks to see if it was ie9, then redirected it to the specific file just for it's sorry ass. – Hebraize

It should also be noted that when using ForceType , IE uses whatever this is set to and ignores anything you put in the PHP page. That is why you get the 406 error. That is why I had to name the file to .css so IE would be happy. – Hebraize

Answer 7

For Internet Explorer 9 serving HTTP 406 status code in the response header for a dynamically generated CSS file we:

1. Removed the Apache mod_negiotiation module or added -Multiviews to the host configuration (or .htaccess).
2. Activated Apache mod_rewrite

3. Added a rewrite rule to the virtual host configuration or htaccess:

   <IfModule mod_rewrite.c
   
     RewriteEngine on
     RewriteBase /
   
     #serve CSS and JS from combine.php
     RewriteRule ^combine(.*) combine.php [NC,L]
   
   </IfModule>
   

Note: This solution is only good for servers/virtual-hosts not using Multiviews as removing mod_negotiation removes usage of this directive as well.

Crass

Answer 8

Recently I had a problem like this for myself too. Nasty debugging is all I can tell about this. Not sure if this might help you people, but I hope it will. Cut to the chase.

Internet Explorer uses something called Mime-type sniffing, which simply reads 200 Bytes of THE FILE header.

I had a PHP script which had to return different video file (with data - the whole file) dependent on the parameter it had been supplied with.

My video request example: get-video.php?id=here_goes_the_id

$file = ''; // Get the video file path
if (is_file($file)) {
    header("Content-Type: video/mp4");
    header("Content-Length: " . filesize($file));
    readfile($file);
}
exit(); // This is the turnaround

You have to suspend your script immediately after it sends the file data. This prevents the IE Mime-type sniffing.

Hope it helps.

Glenine