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

General Discussion

Posted by Silvia Balu
Silvia Balu
8,963 Points

Mike's T-shirts: why is there a white wrapper around "shirts" on my index page?

I wrote the same code on each page: ''' <?php $pageTitle = "Unique T-shirts designed by a frog"; include('inc/header.php'); ?> ''' On the index page there is this white wrapper around the text "shirts" which should not be there. On all other pages it looks normal.

https://plus.google.com/photos/112022764429129319169/albums/6026768110675541505/6033646029402623442?banner=pwa&pid=6033646029402623442&oid=112022764429129319169

thomascawthorn
thomascawthorn
22,986 Points

I think you're going to have to paste in your code if you want a quick answer :-) An alternative is to download the project files and compare.

4 Answers

Silvia Balu
Silvia Balu
8,963 Points
Silvia Balu
Silvia Balu
8,963 Points

Ok the header.php is the same everywhere:

<html>
<head>
    <title><?php echo $pageTitle; ?></title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" href="http://fonts.googleapis.com/css?family=Oswald:400,700" type="text/css">
    <link rel="shortcut icon" href="favicon.ico">
</head>
<body>

    <div class="header">

        <div class="wrapper">

            <h1 class="branding-title"><a href="./">Shirts 4 Mike</a></h1>

            <ul class="nav">
                <li class="shirts <?php if ($section == "shirts") { echo "on"; } ?>"><a href="shirts.php">Shirts</a></li>
                <li class="contact <?php if ($section == "contact") { echo "on"; } ?>"><a href="contact.php">Contact</a></li>
                <li class="cart"><a href="#">Shopping Cart</a></li>
            </ul>

        </div>

    </div>

    <div id="content">

And I just included it in all pages with the code I wrote in the previous post above. Thank you, I'll download the files and have a look!

thomascawthorn
thomascawthorn
22,986 Points
thomascawthorn
thomascawthorn
22,986 Points

If you're header is the same, and other pages are working, it sounds like a problem with the index page. I would check +You've closed all your divs +You haven't misspelled any of the classes/id's +You haven't accidentally used 'id' instead of 'class' Hope this helps!

Silvia Balu
Silvia Balu
8,963 Points
Silvia Balu
Silvia Balu
8,963 Points

Yes, probably it's some spelling error or not closing tags properly. I replaced my index code with the project code and now the index page looks good again! :)

Jason Anello
PLUS
Jason Anello
Courses Plus Student 94,610 Points
Jason Anello
Jason Anello
Courses Plus Student 94,610 Points

Hi Silvia,

The $section variable is undefined on the home page and so php issues a notice on that page right inside your class attributes. Each part of the notice message is then interpreted as a class name by the browser. This is why you end up getting the unintended styling that you see on the home page.

This never comes up in the video if I remember right but they do have a fix for it in the project files which is probably why it worked out for you when you switched over.

They added $section = "home"; to index.php. So even though it's not needed on that page at least it's defined and you won't get the notices anymore.

I recommend instead to update the navigation scripts to check first if the $section variable is set. This way you don't have to remember to set the $section variable to something even on the pages that don't use it.

<li class="shirts<?php if ( isset($section) && $section == "shirts") { echo " on"; } ?>"><a href="shirts.php">Shirts</a></li>
<li class="contact<?php if ( isset($section) && $section == "contact") { echo " on"; } ?>"><a href="contact.php">Contact</a></li>