FAQ: The Box Model - Resetting Defaults


#1

This community-built FAQ covers the “Resetting Defaults” exercise from the lesson “The Box Model”.

Paths and Courses
This exercise can be found in the following Codecademy content:

Web Development

Learn CSS

FAQs on the exercise Resetting Defaults

Join the Discussion. Help a fellow learner on their journey.

Ask or answer a question about this exercise by clicking reply (reply) below!

Agree with a comment or answer? Like (like) to up-vote the contribution!

Need broader help or resources? Head here.

Looking for motivation to keep learning? Join our wider discussions.

Learn more about how to use this guide.

Found a bug? Report it!

Have a question about your account or billing? Reach out to our customer support team!

None of the above? Find out where to ask other questions here!


#2

A post was split to a new topic: Can we use { opacity: 0 } instead of visibility?


#3

Is using

*{
margin: 0;
padding: 0;
}

the best way to do this?

I ran this by a friend who works as a front end dev and he suggested using this instead:

Html, body{
margin: 0;
padding: 0;
)

What are some thoughts on this? Are there trade-offs to using one method over the other? Does it essentially do the same thing?


#4

Universal selector use comes with a cost. How many HTMLElements are there? Every one of them will be given this rule. This becomes even more expensive in a page that has any CSS or DOM interaction since the page has to be redrawn with every interaction. Sure it’s cool, and looks like a magic pill to apply an instant global solution, but remember the cost. This selector is never cheap.

Write resets on elements that are actually in the document, and forgo the instant solution approach. It will be much less costly in terms of resource use and performance.