Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What does "*" mean in CSS?

I have been looking at the CSS files for many websites like Facebook and Youtube.

In almost all of them I see this code:

* { margin: 0; padding: 0; } 

It is odd, as removing that block in chrome web developer tools doesn't affect the layout of the page.

What does this code mean, and when is it used and why?

like image 213
H Bellamy Avatar asked Jan 03 '12 17:01

H Bellamy


People also ask

What does * do in CSS?

The asterisk (*) is known as the CSS universal selectors. It can be used to select any and all types of elements in an HTML page. The asterisk can also be followed by a selector while using to select a child object. This selector is useful when we want to select all the elements on the page.

What does adding * in CSS mean?

This is a common technique called a CSS reset. Different browsers use different default margins, causing sites to look different by margins. The * means "all elements" (a universal selector), so we are setting all elements to have zero margins, and zero padding, thus making them look the same in all browsers.

What does class * mean in CSS?

In CSS, a class is a group of elements that are the same or similar. You can have as many elements as you want in a class. And each element can be the member of multiple classes. Every class has CSS attributes (like color and font-size) that are specific to that class. CSS classes are similar to a real-life class.


1 Answers

This is a common technique called a CSS reset. Different browsers use different default margins, causing sites to look different by margins. The * means "all elements" (a universal selector), so we are setting all elements to have zero margins, and zero padding, thus making them look the same in all browsers.

like image 62
vcsjones Avatar answered Oct 02 '22 15:10

vcsjones