Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Loek Weijts
Loek Weijts
6,159 Points

Why is de universal selector = * .known to be slow? Is it wrong to use it?

I want to use the universal selector simple for setting de margins and padding on 0

  • { margin: 0; padding 0; }

Is there a better way?

3 Answers

Hi Loek,

I have not seen the * selector used to remove margin and padding of all elements. More often than not margin and padding needs adjusting, not removing completely.

You will see see the * selector used widely for the use of box-sizing, for example :-

* {
  box-sizing: border-box;
}

If you take a look over normalize.css you will notice at no point does it refer to all elements, it picks the elements specifically and adjusts accordingly.

My advice would be to use normalize.css to create browser consistency and then set margin and padding on a per element basis.

Hope this helps

Craig :)

Jonathon Pennewell
Jonathon Pennewell
383 Points

That's the way I use the universal selector, that and Normalize.css to get rid of the default margin and padding that the browser renders. I don't think it's used for much more than that. But I'm still a bit of a novice. And I'm not sure if it's slow, should work/render like any other element. I think people just mention not to use it for default styling like Font-Size, Font-Family, Color, etc.

Jonathon Pennewell
Jonathon Pennewell
383 Points

Craig Watson is an idiot, how you going to give him best vote? If he's never seen CSS reset before with a universal selector, then he's a noob. Normailze.css basically does the same thing, gets rid of all the browser inconsistencies. I use this simple code for all my projects.

  • { margin: 0; padding: 0; box-sizing: border-box; }

Nice job giving the best answer to the guy who doesn't know what he's talking about.