Welcome to the Treehouse Community

The Treehouse Community is a meeting place for developers, designers, and programmers of all backgrounds and skill levels to get support. Collaborate here on code errors or bugs that you need feedback on, or asking for an extra set of eyes on your latest project. Join thousands of Treehouse students and alumni in the community today. (Note: Only Treehouse students can comment or ask questions, but non-students are welcome to browse our conversations.)

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and a supportive community. Start your free trial today.

CSS Compass Basics Compass Layout and Typography Compass Typography

Wayne Priestley
Wayne Priestley
19,567 Points

Getting a Bummer! Error.

Hi all,

Can someone take a look at this and see if they can get my code to pass please.
I'm getting a Bummer error telling me to make sure i include the p tag, which i obviously have.

Thanks

Here is a link to the challenge.

sass/style.scss
/* Write your SCSS code below. */

// Imports
@import "compass/typography";
// Variables
$base-font-size: 16px;
$base-line-height: 24px;
@include establish-baseline;

// Page Styles

h1 {
  @include adjust-font-size-to(48px);
  margin-bottom: rhythm(1, 48px);
}

h2 {
  @include adjust-font-size-to(36px);
  margin-bottom: rhythm(1, 36px);
}

P {
  @include trailer;
}
index.html
<!DOCTYPE html>
<html>
<head>
  <title>My Compass Project</title>
  <link href="stylesheets/page.css" rel="stylesheet">
  <link href="stylesheets/style.css" rel="stylesheet">
</head>
<body>
<body>
  <div class="container">
    <header class="main-header">
      <a class="main-logo" href="#">My Compass</a>
      <ul class="main-nav">
        <li><a href="#">About</a></li>
        <li><a href="#">Work</a></li>
        <li><a href="#">Blog</a></li>
      </ul>
    </header>
    <div class="main-content">
      <h1>Vertical Rhythm</h1>
      <p><a href="#a">Artisan kitsch mlkshk</a> Neutra, Cosby sweater literally McSweeney's banjo cornhole PBR&B. Scenester biodiesel roof party, gastropub four loko master cleanse fixie squid vinyl banjo umami slow-carb swag +1 craft beer.</p>
      <p>Direct trade gluten-free swag, <a href="#b">Banksy ugh craft beer</a> tattooed single-origin coffee pour-over quinoa jean shorts. Seitan Intelligentsia Brooklyn, fanny pack lo-fi Etsy cardigan Pinterest before they sold out hashtag Williamsburg narwhal gentrify bicycle rights wolf. Schlitz leggings try-hard butcher stumptown.</p>
      <p>Selvage Etsy <a href="#c">Williamsburg gastropub</a> ethnic. Trust fund Marfa tousled, dreamcatcher Vice PBR&B disrupt street art Pitchfork. Viral yr twee food truck trust fund.</p>
      <h2>Retro Street Art</h2>
      <p><a href="#c">Hashtag twee</a> Carles, Thundercats PBR viral gluten-free YOLO polaroid actually. 8-bit Echo Park blog, leggings narwhal forage Tonx butcher retro cardigan PBR&B direct trade mumblecore craft beer 3 wolf moon.</p>
      <p>Art party iPhone freegan bespoke, ethnic Truffaut XOXO. 8-bit &mdash; vinyl Odd Future paleo, tofu vegan gastropub art party tattooed pug. Gastropub vegan photo booth mumblecore selvage Tonx flexitarian, readymade DIY typewriter <a href="#d">3 wolf moon</a> butcher street art.</p>
      <p>Paleo ethical literally, selvage fap pug post-ironic put a bird on it bespoke. Next level VHS photo booth, four loko mixtape Austin Blue Bottle pork belly Schlitz plaid. Ennui gentrify next level organic, Tumblr mumblecore street art paleo Banksy asymmetrical PBR&B ethnic.</p>
      <h3>Cray Post-ironic Mixtape</h3>
      <p>Selvage Etsy Williamsburg gastropub ethnic. Trust fund Marfa tousled, dreamcatcher Vice PBR&B disrupt street art Pitchfork. Viral yr twee <a href="#e">food truck</a> trust fund. Keffiyeh chia ethnic, Pitchfork Tonx cardigan small batch literally butcher Blue Bottle shabby chic 8-bit.</p>
      <p>Keytar master cleanse McSweeney's Thundercats cardigan, seitan literally organic Vice butcher cliche. Four loko 3 wolf moon hella, messenger bag next level PBR&B photo booth pug fap bicycle rights fanny pack salvia.</p>
    </div>
    <div class="root-footer"></div>
  </div>
  <footer class="main-footer">
    <p>&copy;2014 My Compass Layout</p>
  </footer>
</body>
</html>
Nejc Vukovic
seal-mask
.a{fill-rule:evenodd;}techdegree
Nejc Vukovic
Full Stack JavaScript Techdegree Student 36,386 Points

Hi,

Maybe your "P" should be changed to "p". You have to point the <p> ... in your case you are declaring for <P> ... be aware that selectors are case sensitive...

Let me know if it helps. Regards,

Nejc

Wayne Priestley
Wayne Priestley
19,567 Points

Hi Nejc,

Thanks, i spotted that while you were writing your reply, it appears Text Expander was set to capitalise the first letter in every new paragraph.
I have updated my settings now so i shouldn't run into this again.

2 Answers

Wayne Priestley
Wayne Priestley
19,567 Points

Okay...

STUPID!!!! autocorrect was capitalising the p

Problem solved

Nejc Vukovic
seal-mask
.a{fill-rule:evenodd;}techdegree
Nejc Vukovic
Full Stack JavaScript Techdegree Student 36,386 Points

Hi,

No worries. Had a problem like that once. Since then I'm double checking just to be sure: maybe you should use "Sublime Text" it's quite good.

Wayne Priestley
Wayne Priestley
19,567 Points

Yep, I do use sublime Text, but this was a code challenge and Text Expander was set to capitalise first letter in a paragraph on Safari.