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 CSS Layout Techniques Grid Layout Testing our Grid

Thomas Swofford
Thomas Swofford
1,399 Points

Grids don't add to 12

I copied the grid.css exactly, but when i have 2 grids that add to 12, the right column drops. When they add to 11 or less they work fine. 1 div is a form the other is text.

2 Answers

You should post some code so we can take a look, but one thing I can think of is possibly your reset.css link is in the wrong place or you don't have one.

Thomas Swofford
Thomas Swofford
1,399 Points

here is the code: html the grid & normalize css are downloads from the course

<div class="main"> <div class="grid-container"> <div class="grid-4"> <form action="<?php $_SERVER['PHP_SELF'] ?>" method = "Post"> <h3>Register</h3> <p>Registration allows you to access coupons and other information.</p> <label for="first_name">First Name <span>required</span></label><br /> <input name="first_name" type ="text" size="20" id="first_name" value="<?php echo ($first_name) ?>"/><br /> <label for="last_name">Last Name<span> required</span></label><br /> <input name="last_name" type="text" size="20" id="last_name" value="<?php echo ($last_name) ?>" /><br /> <label for="email">Email<span> required</span></label><br /> <input name= "email" type="text" size="20" id="email" value="<?php echo ($email) ?>" /><br /> <label for="password1">Password<span> required - 4 to 8 letters/numbers</span></label><br /> <input name= "password1" type="password" size="10" id="password1" /><br /> <label for="password2">Type password again<span> required</span></label><br /> <input name= "password2" type="password" size="10" id="password2" /><br /> <input type="submit" value="Go" name="submitted"/> </form> </div> <div class="grid-8"> <p>askjldhisadhyfasdfhpiosadhfpiod adgefaljksdgfkalsjhdfkljsad asdfhasdfho;al djkfhkjsdfhkalsdjf asdfhkasdf haskdlfhksal aksdhfksahdfksalhdf;safhd;k sdkfhasdkfhsadfhas;ldfjsaldfh;kasldhf;ksahdfa;sdhflsakdf;sadhklfh;ksaldf asdljfhksa;ldfh;ksadhf;asldkfhas;kldfh;sakdfh;saldkfhsa;dfhklsa;kldfh;sakldfh jkalsdhfioprwehpqhfvklasdjogf[asdfu[oasdhjo[</p> <p>askjldhisadhyfasdfhpiosadhfpiod</p> <p>askjldhisadhyfasdfhpiosadhfpiod</p> <p>askjldhisadhyfasdfhpiosadhfpiod</p> </div> </div> <!-- end container--> <div class="grid-container"> <div class="grid-6"> <img src="HM340_020.JPG" /> </div> <div class="grid-6"> <img src="HM340_020.JPG" /> </div>

</div> <!-- end container--> </div> <!--end main div--> </body>

Thomas Swofford
Thomas Swofford
1,399 Points

I pasted the html code and it did what it did above. I will close the question.

Did you use the backticks to denote the start and end of your code?