GuidesPHPBuilder: Browser Detection and Appropriate CSS Generation

PHPBuilder: Browser Detection and Appropriate CSS Generation

ServerWatch content and product recommendations are editorially independent. We may make money when you click on links to our partners. Learn More.




“Whoever said CSS would solve all your cross-platform browser display issues needs
to lay off the pipe a little. I have yet to get CSS to work perfectly across all browsers /
platforms, but I have gotten it to work “good enough” to get by.”
Whoever said CSS would solve all your cross-platform browser
display issues needs to lay off the pipe a little. I have yet to get CSS
to work perfectly across all browsers / platforms, but I have gotten
it to work good enough to get by.

“I did it by using some fairly simplistic browser detection, as in recycling a library I
wrote for SourceForge (which was recycled from a library on GotoCity.com).”

“Here are some of the things I discovered while setting up CSS on a handful of sites:

  1. If you don’t set a font at all, users will complain because their browser
    defaults are either too big or too small – as if it’s your fault.
  2. Using the CSS1 font-size: tag with a specific point size like 12pt breaks
    some browsers on some platforms (Netscape on Wintel).
  3. Even if that weren’t the case, point sizes are different on different platforms
    (Macs display fonts smaller than Windows).
  4. And even if they rendered the same across all platforms, it’s a really bad idea
    to hard-code sizes, as there are many people with impaired vision. When you hard-code
    a point-size, they can’t override the size with their browser, and thus can’t see your site.
    One of the worst sites on the internet is CNN.com, which hard-codes very small fonts into
    their CSS sheet.
  5. Because of this, you should stick with scaling percentages or the size syntax
    (small, medium, x-small, etc).”

Want to discuss PHP with other Apache Today readers? Then check out the PHP discussion at Apache Today Discussions.

Get the Free Newsletter!

Subscribe to Daily Tech Insider for top news, trends & analysis

Latest Posts

Related Stories