FAQ: CSS Typography - Text Alignment

This community-built FAQ covers the “Text Alignment” exercise from the lesson “CSS Typography”.

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

Web Development

Learn CSS

FAQs on the exercise Text Alignment

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 (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 (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!

How come the heading h1 is already in the center before we align text? What is the piece of code that enables that?

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.

How do you code justified text using CSS/HTML?


p {
  text-align: justify;

Ah, its that easy :wink:


1 Like

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.

1 Like