Tripoli CSS Reset



The Tripoli Reset, used by such design/business heavyweights as Mint.com, is a comprehensive and well-crafted generic CSS Reset, which doesn’t just carefully reset all browser standards – it rebuilds them too, quietly and with cutting-edge web development in mind.

For that reason, it has been referred to as a ‘framework’, but according to Hellsing,

Tripoli is not a CSS framework. It doesn’t tell you how to code your web site. Instead, it forms a solid HTML rendering engine and a base for creating dynamic layouts without interfering with typographic measurements.

You can click here to jump to the scripts, or keep reading for some discussion…

Not sure what he means? Again, Tripoli is comprehensive. It really covers most everything… however it seems to fly in the face of keeping your CSS Reset as small and specific as possible.

What Tripoli is good for:

  • Resetting and rebuilding all browser defaults for maximum compatibility
  • Forming a generic standard for rendering tags in HTML4
  • Unifying all browser defaults for maximum compatibility across browsers
  • Taking care of deprecated HTML4 tags by disabling them in the CSS
  • To simplify the creation of well-design webpages for designers and developers of all skill levels

CSS Tripoli Reset Code:

* {
margin: 0; 
padding: 0; 
text-decoration: none; 
font-size: 1em; 
outline: none;
}

code, kbd, samp, pre, tt, var, textarea, input, select, isindex, listing, xmp, plaintext {
font: inherit; 
font-size: 1em; 
white-space: normal;
}

dfn, i, cite, var, address, em {
font-style: normal;
}

th, b, strong, h1, h2, h3, h4, h5, h6 {
font-weight: normal;
}

a, img, a img, iframe, form, fieldset, abbr, acronym, object, applet, table {
border: none;
}

table {
border-collapse: collapse; 
border-spacing: 0;
}

caption, th, td, center {
text-align: left; 
vertical-align: top;
}

body {
line-height: 1; 
background: white; 
color: black;
}

q {
quotes: "" "";
}

ul, ol, dir, menu {
list-style: none;
}

sub, sup {
vertical-align: baseline;
}

a {
color: inherit;
}

hr {
display: none;
} /* we don't need a visual hr in layout */

font {
color: inherit !important; 
font: inherit !important; 
color: inherit !important;
} /* disables some nasty font attributes in standard browsers */

marquee {
overflow: inherit !important; 
-moz-binding: none;
}

blink {
text-decoration: none;
}

nobr {
white-space: normal;
}
4 thoughts on “Tripoli CSS Resetadd yours
  1. Bob said: #

    The links to the Tripoli CSS files are no longer working.

    • Joss said: #

      Thanks! I have a bit of caretaking to do with all the Resets, a few have been updated, so will update these links along with that.

  2. KJ said: #

    I realize this is an old post, but the links are all going to galleria.io. Tripoli seems to be gone.

    • Joss said: #

      Thanks, will look into it.

Leave a reply
this will never be published
@