CSS CSS Basics Understanding Values and Units Em and Rem Units

Paul Kuchnicki
Paul Kuchnicki
824 Points

Trouble with a challenge question

I am struggling with the second challenge question. "Create a new rule that targets the h2. The h2's parent element has a font-size value of 16px. Use an em unit to give the h2 a font-size value equivalent to 53px."

First I tried a font-size of 3.3125rem. My thinking was that 53px/16px=3.3125rem.

When that failed, I then assumed it was because the header is equal to 1.8em. I believe the header is the parent element of the H2 tag, and the question states that the parent element is equal to 16px. Therefore 1.8em=16px. If that was correct, I would need to multiply my original answer of 3.3125 by 1.8.

Obviously I am going wrong somewhere. Can anyone tell me what I am doing incorrectly ? Thank you in advance

style.css
/* Complete the challenge by writing CSS below */

header {
  font-size: 1.8em;
}

.title {
  font-size: 1.625rem;
}

h1 {
  font-size: 5.625rem;
}

h2 {
  font-size: 3.3125rem;
}
index.html
<!DOCTYPE html>
<html>
  <head>
    <title>Lake Tahoe</title>
    <link rel="stylesheet" href="page.css">
    <link rel="stylesheet" href="style.css">
  </head>
  <body>
    <header>
      <span class="title">Journey through the Sierra Nevada Mountains</span>
      <h1>Lake Tahoe, California</h1>
    </header>
    <div class="main-content">
      <p>
        Lake Tahoe is one of the most breathtaking attractions located in California. It's home to a number of ski resorts, summer outdoor recreation, and tourist attractions. Snow and skiing are a significant part of the area's reputation.
      </p>
      <a href="#">Find out more</a>
      <h2>Check out all the Wildlife</h2>
      <p>
        As spawning season approaches, the fish acquire a humpback and protuberant jaw. After spawning, they die and their carcasses provide a feast for gatherings of mink, bears, and Bald eagles.
      </p>
      <a href="#">See the Wildlife</a>
      <h3>From Tents to Resorts</h3>
      <p>
        Lake Tahoe is full of wonderful places to stay. You have the ability to sleep in the outdoors in a tent, or relax like a king at a five star resort. Here are our top three resorts:
      </p>
    </div>
    <footer>
      <p>All rights reserved to the state of <a href="#">California</a>.</p>
      <a href="#top">Back to top &raquo;</a>
    </footer>
  </body>
</html>

2 Answers

Steven Parker
Steven Parker
177,579 Points

Your calculation is correct, but the instructions say "Use an em unit ...". The code here is using "rem" instead.

Paul Kuchnicki
Paul Kuchnicki
824 Points

Thanks Steven! I appreciate the help.