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 Framework Basics Prototyping with Foundation Build an Orbit Content Slider

There is no way I am getting this wrong I give the p element the class "button-group" and when you preview itevenshowsit

I am not doing ANYTHING wrong I followed the step instructions to a tee what is going on?!

index.html
<!DOCTYPE html>
<html>
  <head>
    <title>My Website</title>
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link href="css/normalize.css" rel="stylesheet" media="screen">
    <link href="css/foundation.min.css" rel="stylesheet" media="screen">
    <link href="css/my-styles.css" rel="stylesheet" media="screen">
  </head>
  <body>

    <!-- Content Slider -->
    <div class="row">
      <div class="large-12 columns" data-orbit> 
        <div>
          <h1>I am a Front-end Designer</h1>
          <p class="lead">I design beautiful user interfaces, then bring them to life with HTML, CSS, and JavaScript.</p>
          <p class="button-group">
            <a class="button success" href="#">See my work</a>
            <a class="button" href="#">Hire me!</a>
          </p> 
        </div>
        <div>
          <h1>I Also Write About the Web</h1>
          <p class="lead">I love teaching others about all the latest web in technology.</p>
          <p><a class="button radius" href="#">Read my posts</a>   
        </div>
        <div>
          <h1>Photography is My Favorite Hobby</h1>
          <p class="lead">I love photographing nature, people, and everyday things.</p>
          <p><a class="button radius" href="#">See my work</a></p> 
        </div>
      </div>
    </div><!-- End Content Slider -->

    <script>
      document.write('<script src=' +
      ('__proto__' in {} ? 'js/vendor/zepto' : 'js/vendor/jquery') +
      '.js><\/script>')
    </script>
    <script src="js/foundation.min.js"></script>
    <script>
      $(document).foundation();
    </script>  
  </body>
</html>

1 Answer

Tim Knight
Tim Knight
28,888 Points

Hi Justin,

You have the .button-group class in there correctly. Where your code seems to have an issue is on the third challenge of the green button. The question asks you to put the green but on the "Hire me" item, but you have it on the "See my work" item. Just remove the .success class from "See my work" and put it on the "Hire me" instead.