I don't think you can ever take into account all the incompatibility, at least, not these days, when there are two many of them. You can achieve compatibility only to some set of cases, only two certain extent. My idea is: limit your design to those cases. But this is not all.
Another important point is: you don't really need your pages to look 100% identical in different browsers. Not only this is not possible, it's just a wrong goal. Rather, you need to keep your sites recognizable, pleasant, fully-functional and, most importantly, convenient and informative in a way, not too sensitive to browser differences. And you main tools should be
clarity, simplicity and the focus on site's content, not "decoration". Please see my past answer:
One CSS compatible to all browser[
^].
Now, a couple of practical ideas on compatibility:
http://en.wikipedia.org/wiki/JQuery[
^],
http://jquery.com/[
^],
http://learn.jquery.com/about-jquery/how-jquery-works/[
^].
You can use jQuery (or some other library) build with compatibility in mind:
http://en.wikipedia.org/wiki/JQuery[
^],
http://jquery.com/[
^].
You may also need this drastic compatibility measure:
all browsers pass the # parameter to the script except for IE 6.[
^].
Good luck,
—SA
Submit an article or tip