CODEWITHSUNDEEP
phpcsscross-browsercompatibility
Sebastian
Sebastian

Reputation: 97

Is it a good approach to detect user agent with PHP and then load proper CSS stylesheet?

As in topic title, I'm working on some project but my CSS works great in Mozilla but in Opera dimensions in px are different.I was trying to fix that using percent dimensions but other issues appears.It's some kind of Opera problem as it recognise CSS code in other way because when inspecting an element, it returns totally different px dimensions of div's and borders for example.My idea to avoid it is to create separate CSS files for specific browsers and choose correct one after checking user agent?Maybe exists shorter way to solve this problem?I need my website displayed correctly in Mozilla,Opera,Chrome.

Upvotes: 0

Views: 49

Answers (1)

tao
tao

Reputation: 90068

While possible, loading a different CSS based on detected browser is not generally considered best practice and defeats the purpose of CSS. Before you take that decision:

  • consider writing cross-browser compatible CSS:
    • use em or rem instead of px as a font-size unit;
    • add browser specific prefixes to properties that require it for added compatibility;
    • use Can I Use when in doubt - it's a great tool;
  • check out browser specific selectors

As a personal note, I have tried this method myself and quickly fell behind updating all required CSS files. I ended up merging them in a single file about one year later and that change alone was harder than expected.

Upvotes: 1

Related Questions