Question

I have a very interesting problem related to Deflate Compression, Apache (htaccess), and CSS files.

I have two CSS files on my server. One is called styles.php and has dynamic values added based on database values through mod_rewrite in the styles/ directory (it is rewritten from styles.php to site.css and there is a text/css header at the beginning of the file). I also have a regular old css file with static content that doesn’t change in the same directory called styles.css.

I’ve wanted to add compression to my site so I added the following line to start compressing my css and js files. I added this to the root_directory for my website.

<ifModule mod_deflate.c>
    <filesMatch "\.(js|css)$">
        SetOutputFilter DEFLATE
    </filesMatch>
</ifModule>

Well initially that didn’t work. So I changed this line in the root htaccess file from this to the next thing. (this code below is located at the top of the file)

AddType application/x-httpd-php5 .html .php
AddType application/x-httpd-php5 .html .php .js .css

Then my js and one of the css files started to be compressed (verified with YSlow…..yay!). The odd thing was the css file that was being rewritten was being compressed (the styles.php file) but the styles.css file (the static one) was no longer being read by the browser. As soon as I deleted “.css” from that AddType line the browser started reading the file again and my css returned to normal, however it was no longer being compressed through apache.

Any thoughts on why a static css file is not being read by the browser if I add the type? I tried it with just text/css instead of .css and it was not compressing the file (but the browser interpreted it).

UPDATE:

I added this to the root htaccess file. We have compressed, interpretted sweetness now.

<filesMatch "\.css$">
FileETag None
<ifModule mod_headers.c>
Header set Content-type "text/css"
</ifModule>
</filesMatch>

Answer 1

When you run a CSS file through the PHP pre-processor, PHP will automatically output it as a text/html file, via default headers, since you’re not manually specifying it. So really, your browser is receiving a file with a .css extension which has headers claiming it’s an HTML file, so it’s trying to interpret it as HTML rather than CSS.

If your CSS file actually needs to be run as PHP and there is PHP in it, you need to re-issue the appropriate file type so when it output, it’s still CSS:

<?php
header('Content-type: text/css');
?>

You can’t just send a CSS file through PHP and expect it to work exactly the same. If you’re not actually pre-processing it with PHP, then you shouldn’t be sending it through there.

---

As for the deflation issue, I could never actually get mod_deflate to work personally (no idea why). I had to use mod_gzip instead.