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

I need help with my coding. The copyright is right under my navigation. Smells Like Bakin'

Everything on the page looks fine but for some reason the copyright is under my navigation. Any ideas?

<!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"> <link rel="stylesheet" href="css/grid.css" type="text/css" media="screen"> </head>
<body> <div class="container clearfix"> <div class="grid_4"> <img src="img/logo.gif" alt="Smells Like Bakin"> </div>

    <div class="grid_8 omega">
        <ul class="nav">
            <li><a href="#">About</a></li>
            <li><a href="#">Cupcakes &amp; Prices</a></li>
            <li><a href="#">Locations</a></li>
            <li class="last"><a href="#">Contact Us</a></li>
        </ul>
    </div>

    <div id="intro" class="grid_9">
        <h1>Opposites do really attract, specially in our kitchen! We combine unexpected flavors that melt together to create ironically delicious desserts.</h1>
        <p><a href="#" class="btn">Browse our Cupcakes</a></p>
    </div>

    <div class="grid_3 omega">
        <img src="img/you-bake-me-blush.gif" alt="You Bake Me Blush">
    </div>

    <div id="featured-cupcake" class="grid_7">
        <h2>Cupcake of the Week</h2>
        <p>This week's featured cupcake is <a href="#">Avocado Chocolate Cupcake</a>. Its strange combo of flavors will kick your taste buds into fiesta mode!</p>
        <img src="img/featured-cupcake.jpg" alt="Avocado Chocolate Cupcake">
    </div>

    <div id="new-cupcakes" class="grid_5 omega">
        <h2>Fresh Out The Oven</h2>
        <p>Our newest cupcakes are <a href="#">Bacon Me Crazy</a> and <a href="#">Jalapeño So Spicy</a>. </p>
        <img src="img/new-cupcake-bacon.jpg" alt="Bacon Me Crazy">
        <img src="img/new-cupcake-jalapeno.jpg" alt="Jalapeño So Spicy">
    </div>

    <div class="grid_7">
        <h2>Inside the Kitchen</h2>
        <p>Smells Like Bakin'started out in the garage of the husband wife duo Allison &amp; Joseph. Allison is the baker, and Joseph found a way for them to make a business out of her tasty treats. Flash forward to today and they have a successful store front, catering business and cupcake truck. </p>
        <p><a href="#" class="btn-small">Read More</a></p>
    </div>

    <div class="grid_5 omega">
        <h2>Get Bakin' With Us</h2>

        <div id="contact">
            <p>Call us: <span>1-555-CUP-CAKE</span><br>
            Email us: <a href="#">bakeon@smellslikebakin.com</a></p>
        </div>

        <p>We announce all of our new flavors first through Facebook &amp; Twitter, and even take requests!</p>
        <a href="http://www.facebook.com/smellslikebakin"><img src="img/facebook.gif" alt="Facebook"></a>
        <a href="https://www.twitter.com/#!/smellslikebakin"><img src="img/twitter.gif" alt="Twitter"></a>
    </div>

    <div id="copyright" class="grid 12">
        <p>&copy; 2012 Smells Like Bakin' Cupcake Company. All Rights Reserved.</p>
    </div>

</div>

</body>

7 Answers

chrismartinson
chrismartinson
3,218 Points

You have:

class="grid 12"

try

class="grid_12"

Sorry, couldn't get the code to show up... =/

Chris Dziewa
Chris Dziewa
17,781 Points

Make sure your div with the id of copyright is set to:

display: inline-block;

Mark Melin
Mark Melin
4,239 Points

You should try using chrome to debug. So in your case, right click on the copyright and then click "inspect element." On the bottom right hand side you should see a style sheet pop up. Look for the rules governing your copyright and gird-12 class to see how it's positioned.

where might i find that Chris Dziewa ?

Matt Campbell
Matt Campbell
9,767 Points

Have you got a left float on the copyright div? If an element is not where it correlates to in the code, it's usually due to it not been floated. And you're looking at the CSS for that.

I still can't find that. Isn't there any problem with the coding I posted?

Chris Dziewa
Chris Dziewa
17,781 Points

This is the grid.css file. Have you created your own css file? Such as style.css?

Thank you Chris Martinson ! That was it! Thank you all for taking some of your time to help too!