Question: I want to reset the default styles of CSS, I'm following the guide: [A Modern CSS Reset](https://piccalil.li/blog/a-modern-css-reset/)

The guide suggest:

```css
body,
h1,
h2,
h3,
h4,
p,
li,
figure,
figcaption,
blockquote,
dl,
dd {
  margin: 0;
}

```

Isn't it the same as this?

```css
*{
  margin: 0;
}

```

Why should I use the first one?

Answer: 
It's not the same. Let me try to explain.

The linked guide suggests resetting elements. The author wants to define their own margins on each of the elements.

**Example 1:**

```
*,
*::before,
*::after {
  box-sizing: border-box;
}

```

This removes the box-sizing from the defined elements, meaning all elements and all ::before and ::after elements). Learn more about the ::before pseudo-element: <https://developer.mozilla.org/en-US/docs/Web/CSS/::before>

**Example 2:**

Furthermore, the guide suggests removing the default margin from a list of elements, not all elements as the `* {}` would do:

```
body,
h1,
h2,
h3,
h4,
p,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

```

Learn more about default values for various elements: <https://www.w3schools.com/cssref/css_default_values.asp>

**Your 2nd code block is resetting margins on everything:**

```
* {
  margin: 0;
}

```

This removes the (default) margin from all elements. You could also overwrite the margin of elements defined before.

And, this is why CSS is named CSS, cascading stylesheets. Styles cascade ... several different style sheets can be active for a single document or element at the same time.
Because they aren't the same.

The list of elements in the above CSS snippet aren't *all* the HTML tags. For starters, the `video` tag isn't added, so it's not equivalent to `*`, which would encompass *all* of the (visual) HTML elements.

Here is a [resource that shows all the tags](https://www.w3schools.com/TAGs/?msclkid=bf2e0df3baa211ec8817a5606eb25a7c&adlt=strict&toWww=1&redig=B03D1EAEC93043918F5B09C0CC5F752D).