Cross-browser compatibility is one of the most complicated issues when we are doing web designing and development. Web standards usually guarantee a (relatively) high degree of consistency, however no browser is perfect and one interesting thing to note is that older browsers have always been quite good at surprising web-developers with their creative understanding of (X)HTML/CSS-code.
However you can still try to make sure that at least most visitors of your web-site can use it, navigate through it and find what they’re looking for as quickly as possible.
Most of the browser compatibility issues are cosmetic in nature (means they affect the look of the web page) and will not affect the functionality of the website. However some older browser versions may have more serious problems when trying to display the site.
Most commonly occurring Cross Browser Compatibility issues
Some of the most commonly occurring web browser compatibility problems are as follows:
Different browsers treat particular elements used in designing websites differently. As for example: different amounts of padding, margins, borders etc. This means your site can look different in every browser if you use default styles. For example giving the value of 5 for padding does not mean the same space in all browsers.
IE6 and IE7 both render resized images extremely badly. When you change the size of an image with CSS or in the HTML, it appears blocky and edgy.
Sometimes image border is visible in IE, even if it is not present around the image while looking in any other browser.
Safari 3+ has an issue with the way it renders light type on a dark background. Some would argue whether this is good or bad, but there’s a way to make it appear lighter.