Question

There are many ways we can deal with CSS browser compatibility issue.
Such as using Box model design or developing different style sheets for different browsers or using Dynamic CSS techniques (writing PHP script in CSS file).

Is there any way that we can know that Style which is being executed in the browser is supported by that browser or not?

Can we write code something like below in dynamic CSS using PHP code. I mean is there any function or way to achieve this functionality.

FILENAME: styles.css.php

<?php
header("content-type: text/css");

// isStyleSupported() function will return true or false with respect to the browser it is being executed
if (isStyleSupported('min-width')) {
   // styles here
} else {
   // alternative style here
}

?>

I know it might be difficult to keep the record of different version of browsers with respect to its CSS support. But still curious, if anyone know any solution or alternative method?

Answer 1

You can’t determine the browser of the client with a purely server side solution like PHP, since the server only sends information out and receives no feedback from the browser.

This sounds like a job for Javascript, where you’d check if a particular CSS style is supported by the client’s browser..

Once you determine what styles the requesting browser supports, you can use AJAX and PHP to serve the correct styles. On the other hand, you could also use pure Javascript to serve the correct styles.

The advantage of using a Javascript function vs an AJAX triggered PHP function, to test for CSS style support, is that you can actually test the individual browser CSS support with JS instead of relying on some documentation of what styles are supported by what browsers, which you would have to do with a PHP function.

At any rate, you need Javascript to determine the browser being used.