Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

CSS

Posted by Tim Brown
Tim Brown
6,663 Points

Help with CSS Basics - Designing with the Latest Features - Media Queries - Task 14 required, please!

Hey all

Appreciate any help you may be able to give, I am going mental here! I am sure I am missing something very simple, but here is the question:

Task 2 of 2 Next, create a new media query that targets all devices when the viewport width is 768px or narrower. Inside the media query, target the .title element and set the font-size to 1.4rem. Finally, target the h1 element and set its font-size to 5rem.

I have entered my text here:

/* Complete the challenge by writing CSS below */

@media (max-width: 1020px) {
  .main-header {
    background-color: tomato;
    color: white;
  }
}

@media (max-width: 768px) {
  .title {
    font-size: 1.4rem;
  }
  .h1 {
    font-size: 5rem;
  }
}

Every time I submit this, I either get a response that says: "Bummer! Did you specify the correct font size for '.title'?"

or it says that task 1 is now failing!

Can anyone shed any light into what I may be doing wrong at all please?

Many thanks in advance!

Marco Boretto
Marco Boretto
29,821 Points

Tim, Lakindu is right! Lakindu, if you want to earn points add an asnswer not a comment cheers

4 Answers

sizwengubane
sizwengubane
15,244 Points

here is the correct answer try copying and pasting the code below..if it works..please make my answer the "best" answer so i can get more points 

@media (max-width: 768px) {
  .title {
    font-size: 1.4rem;
  }
  h1 {
    font-size: 5rem;
  }
}

The mistake u have done is...u added a dot infront of the h1 element selector

Steve Hunter
Steve Hunter
57,712 Points

I edited your comment to show the code blocks more clearly and switch it from a comment to an answer. If your suggestion works for Tim, he can mark your answer as 'best'.

Steve.

sizwengubane
sizwengubane
15,244 Points
sizwengubane
sizwengubane
15,244 Points

Thanks steve :) i owe you big time

Steve Hunter
Steve Hunter
57,712 Points

No probs - I just voted you another point too. ;-)

Tim Brown
Tim Brown
6,663 Points
Tim Brown
Tim Brown
6,663 Points

Thanks guys - I knew it would be something simple that I had missed!

Appreciate the help!

Cheers Tim

sizwengubane
sizwengubane
15,244 Points
sizwengubane
sizwengubane
15,244 Points

u are great..im here for 2 weeks and 2 days now =D i hope u support me in future