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!

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

HTML

Add a 'div' around the 'featured-cupcake' element and give it the classes 'container' and 'clearfix'.

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>Smells Like Bakin' Cupcake Company</title>
  <link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen">
</head>
<body>
  <div Class="Container Clearfix">
  <div id="featured-cupcake">
    <h2>Cupcake of the Week</h2>
    <img src="img/featured-cupcake.jpg">
    </div>
  </div>
</body>
</html>

What really wrong here?

Here is the response I got: Bummer! Your new 'div' doesn't have any classes applied to it.

Someone please help me in identifying the problem

2 Answers

Marcus Tisäter
Marcus Tisäter
4,886 Points

This is how you apply a class to you're div

 <div class="divclassname"> 
CODE
 </div>

You are supposed to wrap it around the featured-cupecake element so that should be in the div of you're divclassname (tip: CODE). Now try figure out how you should do this with two classes and how to acctully wrap it around the featured-cupcake element.

If you are still stuck on this problem, pass in you're code that you've done so far, so we can help you clear this out better.

Good luck!

<!DOCTYPE HTML>
<html>
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <title>Smells Like Bakin' Cupcake Company</title>
  <link rel="stylesheet" href="css/normalize.css" type="text/css" media="screen">
</head>
<body>
  <div Class="Container Clearfix">
  <div id="featured-cupcake">
    <h2>Cupcake of the Week</h2>
    <img src="img/featured-cupcake.jpg">
    </div>
  </div>
</body>
</html>

Interesting. The only thing that I can directly see that could be tripping you up is the capitalization of the "C"s in "container" and "clearfix"

did you try do the same as before but with lowercase "C"s?

<div class="container clearfix">
<div id="featured-cupcake">
    <h2>Cupcake of the Week</h2>
    <img src="img/featured-cupcake.jpg">
    </div>

</div> <!--End container clearfix-->

From what I've read, CSS is not case sensitive but HTML is. Try changing "Container Clearfix" to "container clearfix"

and see if that works.

http://stackoverflow.com/questions/12533926/are-class-names-in-css-selectors-case-sensitive

Just went back and did the code challenge again....consequently you do need to have the "C"s lowercase in order to pass. I passed first with:

 <div class="container clearfix">
  <div id="featured-cupcake">
    <h2>Cupcake of the Week</h2>
    <img src="img/featured-cupcake.jpg">
  </div>
  </div>

But got a "bummer" with:

 <div class="Container Clearfix">
  <div id="featured-cupcake">
    <h2>Cupcake of the Week</h2>
    <img src="img/featured-cupcake.jpg">
  </div>
  </div>

I'm guessing this could be a bug with the interpreter that is reading the code. It may be expecting to see the lowercase "C"s opposed to the uppercase ones.