Hello guys. This is very important to make the style of your website static in any way to make it look same in different browsers to make your website more user friendly. In this post we are going to learn how to Reset Default CSS for all browsers to get same visual equality in all browsers. Every browser has it’s own default style. Each browser has different padding, margin, line height, font size, font family, etc. from other browsers. So, we will use the most popular and widely used CSS reset by Eric Meyer (http://meyerweb.com/).
Eric Meyer’s “CSS Reset” 2.0
/* http://meyerweb.com/eric/tools/css/reset/
v2.0 | 20110126
License: none (public domain)
http://w3epic.com/
*/
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
margin: 0;
padding: 0;
border: 0;
font-size: 100%;
font: inherit;
vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
display: block;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: none;
}
table {
border-collapse: collapse;
border-spacing: 0;
}You can use other CSS reset too, here you will get more – http://www.cssreset.com
Having trouble with CSS reset? Please comment, I’ll be back to you 🙂