What is a reset in CSS?

[cooper.semantics]

There is no need for border-spacing: 0; here:

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

If it was set up as so, it would make sense:

table {
	border-collapse: seperate;
	border-spacing: 0;/* Adjust to liking */
}

[AutisticCuckoo]

That should be border-collapse:separate.

(I wonder why so many people spell that word wrong?)

[gary.turner]

That should be border-collapse:separate.

(I wonder why so many people spell that word wrong?)

Maybe that's the real reason Meyer went with collapse. Makes about the same sense as the rest.

cheers,

gary

[cooper.semantics]

Forgive my third grade spelling

Yeah, I agree that his css reset is bloated.

[RyanReese]

Seh-per-ate

I have always spelled that word wrong. I pronounce it like that. I think Meyer wanted a reset so big and complete noone could add/on and say it wasn't covering every aspect.

[AutisticCuckoo]

Off Topic:

I guess it's easier if Swedish is your first language. We spell it 'separat' and pronounce it seh-pah-raht (with the emphasis on the last syllable).

[Paul O'B]

Off Topic:

That should be border-collapse:separate.

(I wonder why so many people spell that word wrong?)

Maybe they are desperate.

[gary.turner]

Off Topic:

Maybe they are desperate.

But what would cause so many disparate people to be so desperate?

cheers,

gary

[Stomme poes]

Offtopic:
Because they were sent to d-e-f-i-n-i-t-e-l-y.com and got depressed and gave up.

Someone needs to make d-e-p-r-e-c-a-t-e.com.

Is there like an offtopic BBtag??

[Erik J]

Offtopic:
Because they were sent to d-e-f-i-n-i-t-e-l-y.com and got depressed and gave up.

Someone needs to make d-e-p-r-e-c-a-t-e.com.

Is there like an offtopic BBtag??

Off Topic:

Yes,

[OT ]Yes[/OT ]

[ivanhalen]

Sorry to awake a sleeping thread, but I've been thinking about a question: so, what's the real difference between using the universal selector * vs. the Eric Meyer's reset? What are the pro and cons of both methods, making a comparison? And, at last, what is your preferred one?

[RyanReese]

Because *{margin:0;padding:0;} resets all the margins on every element and that includes form elements which is hard to put padding back on some select form elements. Eric Meyers has customized support for every element and is the preferred choice. It doesn't meddle with form elements so many problems associated with form elements and putting padding back in are no problem now with Eric Meyers reset.

[gary.turner]

What are the pro and cons of both methods, making a comparison? And, at last, what is your preferred one?

There are no pro arguments. The only good from either is serendipitous.

Because *{margin:0;padding:0;} resets all the margins on every element and that includes form elements which is hard to put padding back on some select form elements. Eric Meyers has customized support for every element and is the preferred choice. It doesn't meddle with form elements so many problems associated with form elements and putting padding back in are no problem now with Eric Meyers reset.

Good point about the form controls, but that still doesn't make the rest of it any more useful.

In short, this type of reset is a total waste of time, and has no redeeming social value. They are best ignored, and lying unused, may quietly decompose, as garbage does.

cheers,

gary

[RyanReese]

There are no pro arguments. The only good from either is serendipitous.

Good point about the form controls, but that still doesn't make the rest of it any more useful.

In short, this type of reset is a total waste of time, and has no redeeming social value. They are best ignored, and lying unused, may quietly decompose, as garbage does.

cheers,

gary

Don't get me wrong, I'm not endorsing his reset at all because most of it is nonsense. I never use that much elements in my own websites. If I do ever need a form and I dno't feel like working out the hassles I might use Eric Meyers, juts slim it down...a lot.

[gary.turner]

If I do ever need a form and I dno't feel like working out the hassles I might use Eric Meyers, juts slim it down...a lot.

My point, Ryan, is that there is no benefit. What would you expect to gain by using even a slimmed down reset? Be specific; what ill would its use cure?

gary

[RyanReese]

My point, Ryan, is that there is no benefit. What would you expect to gain by using even a slimmed down reset? Be specific; what ill would its use cure?

gary

Nothing I can think of except a little bit of work to fix the select form.

I'm tlaking about REALLY slimmed...so slim you may not even be able to tell it's one of his...just encompassing the elements I use.

[Dan Schulz]

My point, Ryan, is that there is no benefit. What would you expect to gain by using even a slimmed down reset? Be specific; what ill would its use cure?

gary

Just because there's no benefit to you doesn't mean there isn't one for others. I use a reset similar to Eric Meyer's (just slimmed down a lot) and for me, being able to kill the margins on non-form elements and set the vertical alignment to them (I prefer middle) helps me a LOT. Same with being able to reset the default font size and leading (line-height) on everything, and then rebuild from there.

It's a lot like the way the Marine Corps trains its recruits. In order to build up a Marine, you first have to tear down the teen.

[gary.turner]

Dan, I stand by what I said; there is no benefit to anyone in the * reset or Meyer's reset, cut down or not.

If you want to use your own values, just use them. I doubt zero is what you're looking for. Why set any element to zero, then turn around and give it the value you want it to have. You're just wasting time. If you want to waste the time, play solitaire.*

cheers,

gary

* For details of my objection to the reset silliness, see http://csscreator.com/node/34411 --gt

[Dan Schulz]

You want to know why I use the reset instead of just setting the values to what I want within the style rules? Because I don't want to rely on browser defaults, which vary from browser to browser and sometimes even version to version. Starting over with a clean slate is not a waste of time, especially when it makes you more productive, your code leaner (save for the reset itself, but that's beside the point) and cuts down on the need to track what browser is doing what with which bit of code.

In other words, it cuts down the time I need to develop and debug a Web site's stylesheet. I hardly see where that is a waste. Maybe for you and the other anti-reset purists, but not for me. I have a business to run, and in this business, time is money.

[gary.turner]

… to rely on browser defaults, which vary from browser to browser and sometimes even version to version.

I've asked just about every time this subject has come up: Which defaults? On which browsers?

Using a gaggle of resets may give you peace of mind, but it does not save time.

gary

[cooper.semantics]

http://css-class.com/test/css/defaul...t-defaults.htm

[Dan Schulz]

Wait, do you actually expect me to list every single one of them here, line by line? I don't have the time to do that (right now anyway). And how much of a time-waster is it to open a stylesheet template, add the necessary site-specific styles to it, and then "save as" anyway?

[Dan Schulz]

http://css-class.com/test/css/defaul...t-defaults.htm

Very nice reference. Too bad it doesn't go back to IE 5.5 or 6 (for those of us who hardly meddle with JavaScript and find it easier to support those browser versions than many other people).

[Stomme poes]

Dan, Gary's point is if you're going to do this:

(the equivilant of)
h1, h2, h3, p, div, etc {
margin: 0;
}

but then
h1 {
margin: whatever;
}
h2 {
margin: whatever;
}
h3 {
margin: whatever;
}
p {
margin: whatever;
}
etc

Then stating 0 at the beginning doesn't do anything, because you're not relying on browser defaults if you're setting you're own numbers anyway. It's not like the margins, or line heights, or whatever are building up from a browser default.

I think they're good if you want to assume everyone you DON'T touch is sitting at 0. If I know I'm going to set manually margins and line-heights on everything then there's no point in saying "0" first, but much of the time I'm leaving things alone and so would like to assume they are 0.

For me, mostly this is the html and body elements (I never ever set any margins on those elements, why would I? They need to be 0) and lists. I can't think of a single good reason why in some browsers my li's should be pushed in an arbitrary number of units to the right. I should be forced to make that space myself if I need it. And I don't want my lists to have bullets unless I say so, especially since 99% of the lists on any site I make are menus, which don't get bullets. And so far most of my clients want a bullet that doesn't exist: the "-".

Browser defaults, since they aren't the same between each other, means they aren't DWIM (do what I mean). I don't want the same input to make different outputs (which we get anyway from unclear or undefined specs, and bugs, and OS differences).

I started resetting my margins after I found myself doing this all day:

thing {
margin: 0;
padding: 0;
}

I really got sick of repeating that. So now I
* {
margin: 0;
}

which saves me quite a few lines later on.

img {
border: 0;
}
I rarely want a border on my images. No point whatsoever in making every single image have border: 0 on it when I can strip them all with one freakin line. Same goes for vertical-align: bottom; on the things.

I'm going to check out that link Cooper posted and see how much more I can slim down my padding. As Gary pointed out somewhere else, p's and divs don't have default padding, so why am I listing them? I only want to list anyone who does, and then only those who are actually on my page.

[gary.turner]

http://css-class.com/test/css/defaul...t-defaults.htm

Thanks, very good link, especially as it has a link to Safari's stylesheet.

Many of the FF values shown are off. To my knowledge, all font sizes and top/bottom margins in FF2-3.5 are in terms of ems, not px.

Seeing that IE8 now indents lists using padding instead of margin, caused me to run some tests. As of Opera 9.5 (the oldest v9 I have, O8.5 is the old way), and IE8, the four majors all use padding-left 40px (left to right text) for indention.

Back to the chart: It looks like the only things that would benefit from any normalization are the things we'd normally set ourselves anyway for typographic reasons.

cheers,

gary