Make Websites Cross Browser Compatible
This article is going to demonstrate how to make cross browser compatible websites so that it could look similar on all browsers.
Often it happens that after writing quality code your website doesn't look similar on all the browsers. Though you have defined different rules of CSS keeping in mind all the web browers, sometimes you don't get consistent results.
In such case the problem is not in your code. It actually depends on the way different web browsers render the web page. To rectify such errors follow the points below.
Reset your CSS
Before we start to style our web page its better to reset our CSS first. Resetting CSS means removing default values that are predefined for HTML tags.
For example, paragraph tags have some margin before and after its content. Most programmers use the following code:
*
{
margin:0;
padding:0;
}
This simple code removes default margin and padding from all the elements and set it to 0.
To remove all the default values, you have to set it manually for all the elements.
Use Eric Meyers's Reset CSS
If you don't want to do it manually all by yourself then there is another option. Use Eric Meyer's reset CSS. Its very famous CSS and is used by many developers all around the world. You can download it from his website. Just google it or follow the link here.
After downloading it just add the css in your web page and it will remove all the default values from your html elements. After that you have to define your own CSS rules for each element.
Use Normalise.css
Eric Meyer is a good option but some programmers want to retain most of the default values of HTML elements, adjusting CSS in such a way to make it cross browser compatible.
If you are looking for such a solution then instead of Eric Meyer's reset CSS, use 'normalise.css'. Google it or go to the following link over here.
After downloading it, add the css in your web page and it will adjust the CSS maintaining most of the default values making it cross browser compatible.
Yahoo APIs
If you are still looking for something other than the above pre-defined CSS libraries then you can have a look on yahoo's APIs. It is also available as CDN. Yahoo provides everything from css reset to some pre-defined values after resetting it. Visit the following link over here and have a look on what they actually provide.