Reliable browser detection method for HTML/CSS

Factual Questions
1

Sorry to throw a highly technical and narrow question in here, but I need a quality, non-religious answer and it ain’t out there.

Problem: I need to detect IE, all versions including 10 and 11, reliably and relatively simply, to control some CSS parameters.

Now, once upon a time, that was fairly simple with IE conditional comments and various scripts that would read browser ID strings, but then Microsoft decided that IE 10 et. seq. were just so darned compatible they didn’t need special code or compatibility tweaks. So it’s become especially hard to ID later versions of IE without advanced jQuery etc.

Then the webslinging community decided that doing things like detecting browsers and tweaking the code to work around differences was just too too 2009, and in the perfect world of HTML5 such things not only should no longer be done, but never should have been done because only those so unworthy as to write shitty code ever needed such tweaks.

The bottom line is that I have an issue that is 100% IE’s fault, is not fixable no matter how perfect my code is, and needs only one old-school code branch to change one CSS parameter so the page renders the same on IE as on all other browsers. (Specifically, I have an embedded video that has a nominally white background that comes up #ececec gray on Firefox, Chrome, Safari and every other browser I test it on. So I set the background on that page to that slight gray, and the video appears seamlessly embedded as intended. IE is so perfect that it renders the video pure white… meaning I need to tweak the background to white ONLY on IE.)

So if there’s someone in the Dopefield who has a bit of solid, robust code that will detect all versions of IE and let me do a simple CSS toggle and won’t lecture me about how awful such workarounds are and suggest I relearn my web catechism from a pure source… I’d appreciate it.

2

One solution is to detect the browser UA on the server side, and add a conditional body class=“msie10” based on that.

3

I’ve tried several snippets of code that purport to check various variables and then set a cascading class (or some such end use) and none of them is reliable. MS appears to have gone to great lengths to keep IE10-11-on from being uniquely identifiable.

4

Did you isolate whether it was the detection that was failing, or that the class was applied and the style didn’t have the desired effect?

5

for my own curiosity, would you mind linking to the page with the embedded video?

6

The class/style change was trivial and I tested it by reversing the parameters. It’s the detection that’s fubar.

Ticks me off, because I have some really elegant code that detects every other browser reliably, but won’t work with IE10+.

7

Not sure if this still works.

8

Not sure, but the exchange encapsulates the problem:

  1. MS decided to opt out of nearly every browser-identifying practice (because they’re tired of being singled out as being the noncompliant one in the bunch, and now they’re so compliant that no one needs to know it’s them). So they keep moving, hiding and changing the markers.

  2. The web developer world has an <hr> up its ass about the practice of identifying browsers “because the ID can so easily be spoofed.” (Like, so the hell what? Is there a global conspiracy of Opera users chuckling because they’re being ID’d as Safari?)

If there’s a “clean code”/“web superstar” method of making video backgrounds match across browsers without identifying the browser, by all means pass it along. Until then, I need to be able to ID IE for this page to work perfectly.

9

Did you try searching for Trident v6 and v7? Internet Explorer 11: &#8220;Don't call me IE&#8221; - Human Who Codes

Trident is IE’s renderer and should be in its user agent string.

10

It’s not important enough to me to get into a cat-and-mouse game of chasing markers and writing a hundred lines of what-if code - especially when the rules will change every week. Some visitors will just have to have a mismatch between the video and page background.

I could also fix the problem if the Mozilla filters were enabled, but that’s another story.

I think I am mostly irritated at the web development community for holding the attitude that it’s bogus and beneath real need to detect browsers. They can stick it up their bigendians. :smiley:

11

Microsoft annoys web development community, news at 11.

That said, it’s only really 3 conditionals: Is is it IE <= 9? Is it IE 10? Is it IE 11?

12

There are also a lot of libraries out there for browser detection so you don’t have to code it all yourself.

13

Since the question is a little old, I don’t feel bad about a slight hijack with an amusing history of why browsers report their versions the way they do.

14

Sometimes I still wish Gecko never happened. IE6 was just fine with NetCaptor. Shit was broken, but predictably broken in the same way across everyone’s broken Windows installations. It would’ve rendered the SDMB just fine. Netflix could’ve used Flash or Java. What else do you need on the interweb?

The only real lull in the browser wars was when IE6’s Trident owned the world. It was the only real web standard the world had seen; before and after it, there would always be least 2-3 competing renderers with unpredictably different implementations of vague standards. Sigh.

If only Microsoft bought Netscape. And Apple. We’d all be using Windows CE still, but hell, at least we’d only have to code for one browser.