I will not sell or distribute your contact information ever, for any reason.

Parse your CSS file with PHP


Call me irresponsible if you want, and I'm sure this tutorial will eventuallly be obsolete once browsers catch up to web standards, but here's how to do conditional css based on php browser tests. I consider this a better method than using browser specific css hacks, because this method will not fix a problem in one browser at the expense of another like a css hack could. It should also be noted that many of the css hacks that've been used for a while for rendering in IE 6 are now no longer working with IE 7. Though both methods would require going back to your css as new browsers come out for some tweaking, I think this method is a better, more targeted way to fix rendering issues in different browsers. The caution I suppose, is that depending on your situation, using css browser hacks or conditional css fixes with php might not be a good idea. That said, onward!

So you've got a site on some server, and there's some browser that's having a problem with your css. That happens all the time because different browsers render css slightly differently and have varying support for css tags. These are your options:

a) Use css browser hacks like characters that some browsers ignore or cause a browser to ignore the line etc, potentially creating problems in other browsers that were previously working fine, or new browsers that haven't been released yet.
b) Spend lots of time reworking your front end around the problem.
c) Spend lots of time searching for a way to fix the problem that works, potentially finding out that there is none because of the current state of browsers.
d) Build separate css files for each browser, and do php conditions to determine which one to use, which would defeat one of the main reasons to use css in the first place and have you changing that many more files when you want to do a site redesign.
E) Start with css that works in the browsers with the best css support, then use conditional php browser fixes in your css for specific browsers that it has problems in, and remember that you may have to add conditions later for newer browsers as they get released.

First, you need to tell php to parse your css file. To do this (on an Apache server) use a .htaccess file in the directory your css file is contained in, with this small bit of script in it:

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

Then, use the php server variable: $_SERVER['HTTP_USER_AGENT'] to find out what browser the user is using. Say you want to add 20pixels to a top margin for <some reason> in say...Safari.

put this php code at the top of your css file:
<?php Header ("Content-type: text/css");?>
<?php
$user_agent = $_SERVER['HTTP_USER_AGENT'];
$safaricount = substr_count($user_agent, 'Safari');
?>

Then, where you need to fix your margin, use a condition, like this:

<?php if($safaricount >= '1') {
echo 'margin: 20px 0px 0px 0px;';
}
if ($safaricount <= '1') {
echo 'margin: 0px 0px 0px 0px;';
}
?>

There you go, Apache tells php to parse, php finds the $_SERVER variable, counts how many times the browser you're interested in fixing is listed in the string, if it's there it drops one line of css, if it's not it drops the other.