Any solution to reduce browser compatibility issue when writing css style as a web designer / web developer
Any solution to reduce browser compatibility issue when writing CSS style.
These three are the main points you need to do yourself:
- Write correct markup - make sure it checks
- Make sure your markup is in standard mode.
- Write correct CSS - make sure it checks
In addition, you can do some of the following to reduce headaches:
- You can use a CSS framework like Blueprint, 960.gs, YUI CSS library, etc.
- For Internet Explorer related problems there is ie7.js and ie8.js
- Know how HTML and CSS work.
- Test in all browsers you target.
You can also use a CSS reset file to run on common ground.
Well, at the moment there is nothing like fixall () which will make all browsers compatible ... however you can reduce compatibility issues by using the correct doctype. Read this article on using doctrines. Also, check your markup.
Edit: You can go to browser snapshots to see screenshots of your web design in different browsers.
Discipline!
- Submit your HTML . Use the correct DOCTYPE .
- Use standards, crack bugs .
- Be descriptive or use reset stylesheet .
Simple test, test, test.
Firstly, your computer must have at least these browsers: FireFox3.5B, InternetExplorer7 (+ additional Safari 3, Google Chrome 2 Beta and Opera).
Now for a more specific answer:
- avoid styling css3 as "opacity" and so on, since CSS3 is not yet a standard. Instead, use Javascript libraries like jQuery to selectively apply these effects.
- avoid png transparency like the plague ... use gif anti-aliased transparency instead (it's somewhat old now as it now works on IE7 +).
- Testing and testing and testing