CODEWITHSUNDEEP
csscross-browser
Bryan
Bryan

Reputation: 1893

Making website compatible across most browsers

I am trying to figure out the most efficient way to ensure cross-browser compatibility. I have done a bit of research and learned a few interesting things such as the fact that Mozilla/Firefox can't handle a class that has a name starting with a number. Is there a way to make a CSS work for any browser or is it better to just develop multiple CSS and add code to choose which to use based on the browser being used?

Upvotes: 2

Views: 947

Answers (7)

Val
Val

Reputation: 2323

An aside to clarify a point:

... I have done a bit of research and learned a few interesting things such as the fact that Mozilla/Firefox can't handle a class that has a name starting with a number....

Sorry, but that's not a Mozilla limitation, it's in the CSS spec: class names must not start with a number. Any browser that allows them to isn't enforcing the rules properly.

Answered here on StackOverFlow. The relevant part of the spec is at http://www.w3.org/TR/CSS21/syndata.html#characters (see the 2nd paragraph).

Upvotes: 3

jeroen
jeroen

Reputation: 91792

To answer your question: There is no way to make a page using just one universal css and have it displayed equally in all browsers, unless you only use an extremely small sub-set of all available css (selectors, values, etc.).

The way I work is:

  1. Use a css reset
  2. Develop for a browser that adheres to the standards pretty well (Firefox, Chrome, Safari, Opera)
  3. Patch things up for IE using conditional comments (because you'll probably need things that don't validate)

Upvotes: 2

Paulo
Paulo

Reputation: 4333

Regardless of your infrastructure/framework/etc you should test your code on all major browsers. If possible avoid using style sheets for browser specific problems. Browsers will change and adapt which means you might get stuck having to update a bunch of websites when new browsers come out.

CSS is a fickle beast and I haven't found any solution that covers all the quirks except for a lot of due-diligence and testing.

Upvotes: 1

Nosredna
Nosredna

Reputation: 86346

Your goal should be CSS that works on all browsers. If you start out with a CSS file per browser, where do you stop? Mobile Safari? Flock? Konqueror? Every version of every supported browser?

Eventually, you might need to compromise, but you can cross that road when you get there.

Upvotes: 1

Colin Brock
Colin Brock

Reputation: 21575

You might consider using a CSS Framework such as Blueprint. It includes a CSS reset that should help.

Also, you might want to look at Yahoo's CSS reset

Upvotes: 3

Gu1234
Gu1234

Reputation: 3516

A good starting point would be to use CSS reset such as: http://developer.yahoo.com/yui/reset/

Upvotes: 1

Don Branson
Don Branson

Reputation: 13707

You might use a framework that does this for you, such as GWT, but keep in mind that you will still have some issues.

Upvotes: 0

Related Questions