Browser CSS Defaults IE vs. FireFox

Many web developers have experienced issues with their website layouts and designs between browsers. This is often due to the browsers default stylesheet. There are differences between the default stylesheet that is delivered with IE and FireFox. The differences are primarily in the margins and padding of the default style sheet. There are several techniques for fixing this problem including:

1. Design your site so that margins and padding do not affect your layout and positioning such as a fluid layout.
2. Develop a stylesheet that redifines all of the browser default styles for maximum control over display
3. Develop a stylesheet that redefines only the styles that affect your layout and reuse some browser defaults for maximum performance and high level of control over display

I suggest option #3. Most developer problems can be solved by simply redefining the styles that affect your layout in your stylesheet. Redefining all styles would provide developers with more control over the display of a page but may cause negative performance due to large file size which affects download time. I reccomend to only redifine the most commonly used elements which will fix most of your cross browser style issues. To fix the style sheet differences read more of this article.

Problem:
IE styles are different than FireFox

Why:
The browser default stylesheets are not the same.

Fix:
Reset the problematic styles in your site's css.

Code:
The following code standardizes cross-browser rendering on common elements, neutralizing browsers' built-in stylesheets.

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,
pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	margin:0;
	padding:0;
}
table {
	border-collapse:collapse;
	border-spacing:0;
}
fieldset,img { 
	border:0;
}
address,caption,cite,code,dfn,em,strong,th,var {
	font-style:normal;
	font-weight:normal;
}
ol,ul {
	list-style:none;
}
caption,th {
	text-align:left;
}
h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}
q:before,q:after {
	content:'';
}
abbr,acronym { border:0;
}