There are currently no frequently asked questions associated with this exercise – that’s where you come in! You can contribute to this section by offering your own questions, answers, or clarifications on this exercise. Ask or answer a question by clicking reply () below.
If you’ve had an “aha” moment about the concepts, formatting, syntax, or anything else with this exercise, consider sharing those insights! Teaching others and answering their questions is one of the best ways to learn and stay sharp.
Join the Discussion. Help a fellow learner on their journey.
Ask or answer a question about this exercise by clicking reply () below!
Agree with a comment or answer? Like () to up-vote the contribution!
It’s known as the user agent style sheet, the base default styles built into the browser. These styles are necessary to give core elements basic style properties. Headings have defined size, alignment and margins; lists have defined padding and bullets; paragraphs have defined margins; and so on.
As specificity goes, the default styles have the least amount of importance so are easy to override.
Does the .banner have something to do with it? It has text-align: center and when I remove that the h1 defaults to the left. However, that doesn’t make sense as a .class selector should be more specific than an element selector.
I don’t think there’s any user agent style sheet that has the text-align: center; for h1.
.banner is the parent of h1, so h1 will take the the alignment defined in .banner, unless you are more specific and define it in h1. Try giving h1 text-align: left; and you will see, it will override the .banner. However you can be more specific and define .banner h1, that will override both banner and h1 alignments.
) below.
) to up-vote the contribution!