For many years the bane of web developers everywhere has been multi-browser support. I know that it has been one of the many things that I have spent countless hours trying to do correctly. Your site could look perfect and even wow your visitors in every browser except one and that can get so frustrating. Typically, as a web developer, I have found that the one browser I must always provide fixes for is Internet Explorer (curse you Microsoft!!).
There was a trend that showed that Internet Explorer was getting less and less of a market share and I rejoiced with so many other web developers and I even imagined a day when Internet Explorer was no longer the browser of choice. Apparently that trend is over though. According to a study conducted by CNet IE has started to reverse the trend. They have long been the most widely used browser on the planet and they will be for the next hundred years of so (pardon the exaggeration). In light of this, it is handy to know a few tricks that can help you on your way to making your browser safe for all browsers, especially IE.
Whenever I create a new website, I use CSS stylesheets to align everything and to make my site look good. CSS is an easy way to accomplish difficult task such as creating depth or creating elements within elements. I hate TABLE-BASED WEB DESIGN! Some applications still use it and those applications are fine, but normal websites, in my mind, should not use table based layouts. CSS does get displayed differently by different browsers though. IE likes to add it’s own padding to elements and it considers certain position statements to be moot. In order to fix these issues, I always create a separate IE stylesheet with conditional if statements to load the stylesheet if the browser is IE. IE conditional statements look like this:
IE conditional statements can be powerful and can really help you in adjusting positioning specifically for IE. IE is finicky at best with such things as padding. Padding and margin even work much the same if there are no relative elements to push against in IE. Be careful when using margins and padding on individual elements. Try using only positioning, margins and padding on parent elements and not on individual elements that need to be lined up next to one another.
I know that I stated that I disapprove of table base web design, but there are times when tables can work effectively for some elements. One element would be a form. It is difficult to arrange labels and input elements in the same area with just CSS and many times it takes a ridiculous amount of CSS to position everything correctly. In these cases, go ahead and use tables. You have my blessing, but using tables to align ever element on a page is both outdated and clumsy practice.