CSS Browser Detection

@irishbuzz - how does one use this though. If I paste it in, it causes havoc, but looking at it I define some of the elements afterward, so this is confusing to me. thoughts?

ator 2010-08-24 23:12:23

@Jim - to include it you can just link it separately to your existing CSS file in the head, alternatively you can paste into your existing CSS file but either way it must be before the other CSS. Would it be possible to provide a demo pages with and without the reset stylesheet so I can see what might be amiss.

irishbuzz 2010-08-24 23:20:24

@irishbuzz - See edits to post......

ator 2010-08-24 23:29:04

@Jim - The reset seems to be doing it's job just fine i.e. it has reset all the browser differences. Some of these resets include font-size, padding and margins so you will now need to enter in your CSS styling for your own page.P.S is there any reason why you are using custom tags as opposed to using `<span class="appleBlue">s</span>` etc.?

irishbuzz 2010-08-24 23:49:39

@irishbuzz - isn't that one of the main benefits of HTML5?

ator 2010-08-24 23:52:37

@irishbuzz - can you tell me what the real benefit here is, even with the reset CSS, I have the same issues as before with the boxes not aligning the same in all browsers, etc. There must be something fundamental that I am missing.

ator 2010-08-24 23:59:13

irishbuzz 2010-08-25 00:00:47

@irishbuzz - OK, so I think the reset does help. with explicitly adding the CSS for margins, padding, etc, I am much better off and there is definitely more fluid among browsers for sure.

ator 2010-08-25 00:06:04

I looked into it some more and I'm really not sure that custom tags are allowed in HTML5. Plenty of new tags have been introduced such as `<header>`, `<menu>` and `<video>` but you must stick within the tag reference as defined [here](http://www.w3schools.com/html5/html5_reference.asp)

irishbuzz 2010-08-25 12:53:44

+1 A:

The only real problem with browser detection is the fact that if newer version of browser will support some new features (rounded borders for example), but you still will be doing some workarounds.

Better approach is to use feature detection, so you will be able to use some specific browser capabilities if it has support of them and some graceful degradation pattern when something isn't supported.

For CSS most pragmatic approach is to have reset CSS included for all browsers, then have some common CSS rules which look the same in all browser and additional CSS files for different browsers which contain rules that should be different for different engines.

From my latest experience it's almost always possible to maintain only two versions of these DIFF files - one for Firefox, Safari, Chrome and another for IE family. And use feature detection for JS.

dimarzionist 2010-08-25 02:04:14

First of all, no version of IE can handle the new elements of HTML5 without javascript help. Only modern browsers can and IE is not a modern browser.

As far as the other browsers go, I'll have to look more but I've not had any issue with any sites I've done but, then, I don't use CSS resets and set all the CSS on the elements myself.

Rob 2010-08-25 02:27:00

ansaurus

tags:

views:

answers:

CSS Browser Detection

related questions