CSS Browser Styling Reset


If you are working on a front end design you will notice fairly quick that the browser enforces some default styles on to your theme. To have no interference from your browser with the design you made, you want to do a css browser reset. If you reset the browser styling, you will have more consistency and a better cross browser experience of your ui design.

To reset the css styling for all browsers just add this code to your main css file and you can overwrite al styling to your liking:

Version: v1.0
License: none (public domain)

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;

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {

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; }
CSS browser styling reset
  • User Ratings (1 Votes)

Leave A Reply