SitePoint Sponsor |
|
User Tag List
Results 1 to 17 of 17
-
Sep 20, 2007, 10:06 #1
- Join Date
- Dec 2003
- Location
- USA
- Posts
- 2,582
- Mentioned
- 29 Post(s)
- Tagged
- 0 Thread(s)
CSS Reset and other browser neutralizers.
I've heard about CSS reset but I've never really used it or any other neutralizers to help me in my work. But, the more I read about them, the more curious I get and I wonder if they'll really help me to create better pages faster.
So, what are they all about exactly? Is there a standard reset page everyone uses, and are there any other reset-like pages that everyone uses often with their designs?
Thanks.Xazure.Net - My Blog - About Programming and Web Development
Follow Me on Twitter!
Christian Snodgrass
-
Sep 20, 2007, 11:21 #2
- Join Date
- Jun 2004
- Location
- "Then I figure the most good good guy will win."
- Posts
- 1,666
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Hi,
I personally like the YUI approach to resets, fonts, and base styles.
undohtml.css by Tantek.
For more info, Google "css frameworks". I am sure most will have a reset style sheet... I personally like and use variations of the YUI utility style sheets.
Good luck.
Cheers,
Micky
-
Sep 20, 2007, 11:22 #3
- Join Date
- Mar 2002
- Location
- northern MI
- Posts
- 1,392
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
The simplest for reset is just a CSS rule removing all default padding and margin on all elements:
* {margin: 0; padding: 0;}
Nowadays it's more or less referring to more advanced stylesheets that makes it more efficient to make consistent designs and get rid of some of the peculiar browser differences. Eric Meyer and the Yahoo interface library have the ones I've looked at
http://meyerweb.com/eric/thoughts/20...eset-reloaded/
http://developer.yahoo.com/yui/reset/
I've basically made my own, but it's more of a custom reset based on the group of proprietary web applications I style on a regular basis.
-
Sep 20, 2007, 11:38 #4
- Join Date
- Jun 2004
- Location
- "Then I figure the most good good guy will win."
- Posts
- 1,666
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Howdy,
Here is a similar thread that talks about the * reset approach.
I think it is best to avoid that approach for anything other than quick-and-dirty setups... In the above thread, I quote and link to some good info as to why one should avoid using the * reset. Paul has also posted some great info.
Off Topic:
JunJun, cool cat pic!
-
Sep 20, 2007, 12:55 #5
- Join Date
- Mar 2002
- Location
- northern MI
- Posts
- 1,392
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
-
Sep 20, 2007, 15:01 #6
- Join Date
- Dec 2003
- Location
- USA
- Posts
- 2,582
- Mentioned
- 29 Post(s)
- Tagged
- 0 Thread(s)
Thanks for the info. I'll check out those articles you gave me.
Up to this point, the only kind of "reset" I really used was to simply remove the padding and margin, but only on the elements I needed it removed on.Xazure.Net - My Blog - About Programming and Web Development
Follow Me on Twitter!
Christian Snodgrass
-
Sep 20, 2007, 15:18 #7
- Join Date
- Dec 2003
- Location
- USA
- Posts
- 2,582
- Mentioned
- 29 Post(s)
- Tagged
- 0 Thread(s)
After reading all of those documents you presented and actually taking a look at the CSS for each I think I'll go with Eric's. The Yahoo one seemed to be almost over-complete, providing a lot of stuff I didn't really need. Tantek's seemed a little under-developed if I really wanted to use the concept of reseting to it's full extend.
I think I'll take it for a test drive, but I may end up just making my own (which, judging by the contents of those CSS documents, it looks like I've been doing without realizing it anyways).
Thanks for the help and info.Xazure.Net - My Blog - About Programming and Web Development
Follow Me on Twitter!
Christian Snodgrass
-
Sep 24, 2007, 15:23 #8
- Join Date
- Jun 2004
- Location
- "Then I figure the most good good guy will win."
- Posts
- 1,666
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I think Tantek was the originator of the Reset... and that is probably why it is not as robust as any of the others.
I have yet to really looks at Eric's reset, but I think the YUI reset, fonts, and base files make for the perfect combination... But yeah, I have tweaked mine too... Sounds like that is the best bet: find an approach that works well, and modify it to suit your needs. No reason to re-invent the wheel.
Cheers,
Micky
-
Sep 24, 2007, 17:36 #9
- Join Date
- Jul 2006
- Location
- Victoria, Australia
- Posts
- 4,122
- Mentioned
- 29 Post(s)
- Tagged
- 2 Thread(s)
I think i'll adopt the YUI reset as well - i'll just try and trim it down to reset for only the elements that I use regularly.
samanime, it's not only being able to achieve more browser consistency, it means that you don't need to keep writing margin: 0; padding: 0; on every element your styling. It keeps your CSS more lightweight and it's one less thing to think about.
-
Sep 24, 2007, 19:53 #10
- Join Date
- Dec 2003
- Location
- USA
- Posts
- 2,582
- Mentioned
- 29 Post(s)
- Tagged
- 0 Thread(s)
Yes, that's a good point.
However, along with that point comes another question:
Is it better to have a few more lines of CSS in your page, but keep it all in one page call, or to make your main CSS file smaller, but add 1-3 additional page calls. This referring to transfer speeds, bandwidth usage, page calls, etc.
That's probably the first thing that pops into my mind when I see someone using about 6 different CSS pages.Xazure.Net - My Blog - About Programming and Web Development
Follow Me on Twitter!
Christian Snodgrass
-
Sep 25, 2007, 06:56 #11
- Join Date
- Mar 2002
- Location
- northern MI
- Posts
- 1,392
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I try to find a balance, I don't want too many requests to server, but I'd like to keep my CSS logically separated as well. Typically one stylesheet for every major app, one for general layout, one for forms and one for print.
-
Sep 25, 2007, 11:10 #12
- Join Date
- Jun 2004
- Location
- "Then I figure the most good good guy will win."
- Posts
- 1,666
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I am looking forward to using this technique. View source on Home page of Sitepoint to see it in action... pretty cool.
-
Sep 25, 2007, 17:46 #13
- Join Date
- Dec 2003
- Location
- USA
- Posts
- 2,582
- Mentioned
- 29 Post(s)
- Tagged
- 0 Thread(s)
That is an interesting technique indeed. I typically do a manual version of that, but that seems like it could come in handy, especially for larger projects. I'll bookmark that page for future use. Good find.
Xazure.Net - My Blog - About Programming and Web Development
Follow Me on Twitter!
Christian Snodgrass
-
Sep 25, 2007, 23:35 #14
-
Sep 26, 2007, 01:17 #15
- Join Date
- Dec 2004
- Location
- Derbyshire - UK
- Posts
- 2,651
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You may have problems using the universal selector if you have a lot of forms.
If I'm dealing with forms then I'll tend to use Meyer's reset method.
However, if I'm dealing with a standard page without any forms then I see no problem in using the universal reset method.
-
Sep 26, 2007, 07:16 #16
- Join Date
- Mar 2002
- Location
- northern MI
- Posts
- 1,392
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
-
Oct 3, 2007, 13:54 #17
- Join Date
- Jun 2004
- Location
- "Then I figure the most good good guy will win."
- Posts
- 1,666
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Bookmarks