I'm looking for a css reset kit, but I never used one before. So which kits its out there, and whats your experiences regarding these kits?
And, is its any different between these kits, something you need to think about?
I'm looking for a css reset kit, but I never used one before. So which kits its out there, and whats your experiences regarding these kits?
And, is its any different between these kits, something you need to think about?
I like this one, it's four lines long:
* {
padding:0;
margin:0;
}
The consensus, I think, is Eric Meyer's Reset stylesheet. That's what I use.
Alternatively, you could create your own that resets only the basics.
I use Eric Meyer's CSS reset, as do many other people. It's even the reset script that Blueprint CSS uses. Yahoo also has one, Base CSS. I myself am a fan of Blueprint. There's not much of a difference between these kits, because they all do pretty much the same thing: apply standard rules to elements, and eliminate cross-browser inconsistencies.
Well there are two popular ones:
http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
http://developer.yahoo.com/yui/reset/
I personal use YUI's version, but I've seen both used quite frequently.
I use the following from Eric Meyer. It just works.
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, font, 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 {
margin: 0;
padding: 0;
border: 0;
outline: 0;
font-size: 100%;
vertical-align: baseline;
background: transparent;
}
body {
line-height: 1;
}
ol, ul {
list-style: none;
}
blockquote, q {
quotes: none;
}
/* remember to define focus styles! */
:focus {
outline: 0;
}
/* remember to highlight inserts somehow! */
ins {
text-decoration: none;
}
del {
text-decoration: line-through;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
border-collapse: collapse;
border-spacing: 0;
}
Actually Eric Meyer's reset reloaded is his older copy. Go through the top toolbar and click "Toolbox" then find "CSS" and click that. The link should be http://meyerweb.com/eric/tools/css/reset/index.html
I've used Yahoo's Base CSS sheet but I've stuck with Meyer's reset sheet.
I use Blueprint css. But I never use it just for reset. It's the best help I can get for doing a quick layout of a site.
The most important thing about a CSS reset is that it helps you getting your work done easier - therefor you should most probably build your own out of the inspiration you might be getting from already existing and out of your own conclusions about what a CSS reset should do.
My personal CSS reset is a bit different from for example Eric Mayer - but it suits me and makes me more productive which is exactly what it's supposed to do.
The best CSS reset is one that isn't used on any site I have to work with. I don't appreciate being forced to use a bunch of CSS hacks and inline styles, all because someone thought having an easier job was more important than making the site scalable and maintainable for the future. I've spent too many hours reworking code from agencies who never considered the havoc global resets might wreak when implemented in a content management system.