Best CSS reset technique
- Started
- Last post
- 9 Responses
- clearThoughts
What's the best one out there?
- clearThoughts0
And - yes. I did Google it, just interested to hear different opinions about it.
- clearThoughts0
This one from 'The Meyer' looks pretty good but it's from 2007...
- shitehawke0
I don't know about the best, but I use the one included in the download here. Works fine for me.
- spraycan0
i use
*{margin:0;padding:0}
- Stugoo0
something like this :
* {margin:0; padding:0;}
body {
font-size: 62.5%;
font-family: Helvetica, Arial, Helvetica, sans-serif;
background:#fff;
color:#6a6a6a;
}.skipto { position:absolute; top:0; left:-100000px; width:0; height:0; overflow:hidden;}
div { z-index:0;}/* standard*/
h1, h2, h3, h4{ text-align: left; color:#2e2e2e;font-weight:normal...
p {font-size:13px;line-height:17px... 0 17px 0;} /*line-height: 1.30769231em / margin 2em */
ul {margin:0 0 18px 0;list-style: none; }
ul li {margin:0 0 0 0;list-style: none; font-size:13px; }
a { outline:none; color: #0090ca; text-decoration: none;}
a:hover { outline:none; color: #0090ca; text-decoration: underline;}
img {border:0; margin:0px; padding:0px;}
address{ font-style:normal;}
textarea { font-family:Arial, Helvetica, sans-serif;}input.focus, input:focus,
textarea.focus, textarea:focus,
select.focus, select:focus{ color:#0090ca; background:#ededed; }/** generic layout styles **/
.row{width:100%;}
.left{float:left;}
.right{float:right;}
.spanclear{display:block;clear:b...
.clear{clear:both; line-height:0px;font-size:0px;he...
.hide{display:none;}
.rel{position:relative;}
img{border:none;}
.hr {clear:both; line-height:0px; font-size:0px; height:0;padding:0px; margin:0px; border:0; border-top:1px solid #c3c3c3; }
.no_margin { margin:0}
.no_border { border:0 !important;}
- welded0
I use a slightly modified version of Eric Meyer's reset.
- lukus_W0
I use Yahoo's reset script
- not sure it's wise to do so -> but I figure it stands a good chance of being updated regularly with new browser releaseslukus_W
- http://developer.yah…lukus_W
- BannedKappa0
/* RESET THE SHIT */
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;
}
blockquote:before, blockquote:after,
q:before, q:after {
content: '';
content: 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;
}
- bulletfactory0
http://thisistwhite.com/css/rese…
Until I found the current example I'm using, I had never thought to make div, ul, li, form {position:relative;} by default. I haven't seen a downside to this yet, you it's not necessary to put 'postition:relative' on any div elements, since it's already implied.