One major struggle we all have as CSS designers is keeping the consistency across multiple browsers and most of the problems come from the default setting that browsers have for common elements. By using a basic CSS reset and working from there you can override the browser's settings and start fresh from ground zero.

After doing some research I've put together a simple CSS reset. I've seen some more complicated ones but this one seems to work fine for general use. I've even added in a few additions I have yet to see in other CSS resets such as the dotted border that Firefox commonly puts around links and an overflow-x issue I've commonly run into.

Enjoy!

body {
margin: 0;
padding: 0;
overflow-x: hidden;
}

html {
margin: 0;
padding: 0;
overflow-x: hidden;
}

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;
margin: 0;
padding: 0;
}

q:before,q:after {
content: '';
}

abbr,acronym {
border: 0;
}

a {
outline: none;
}