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
Zaida Libertini
2,417 PointsMy preview turns blank (white page) when I add the max-width: 940px; in the css wrapper.
Hello, I was checking my preview while adding the div elements on index.html, and all through adding the wrapper in css, however when I entered the max width value of 940px on css and checked the preview all I could see is a blank page. I deleted the wrapper part of css and the id in div in index.html and my preview works again. I am not sure what is causing this?
Zaida Libertini
2,417 Points/Users/libertinifranco/Desktop/Screen Shot 2016-01-24 at 8.24.37 AM.png
Zaida Libertini
2,417 PointsThank you for helping me. I apologize, I don't know how to post a screenshot here, could you tell me how?
Sean T. Unwin
28,690 PointsIs the image a screenshot of your code?
You can copy and paste your code here. See this link for learning how -- https://teamtreehouse.com/forum/posting-code-to-the-forum
If you really feel that you want to post an image you can use Imgur, it is a free image hosting service. Click the Upload Images button at the top of the page. Then simply copy and paste the link to the image after you upload it.
Zaida Libertini
2,417 PointsThank you, here is my css code:
a {
text-decoration: none;
}
#wrapper {
max-width: 940px;
background: orange;
margin: 0 auto;
}
Zaida Libertini
2,417 Pointsand my html document starting where I added my <div> element:
</header>
<div id="wrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with Color.</p>
</a>
</li>
<li>
<a href="img/numbers-02.jpg">
<img src="img/numbers-02.jpg" alt="">
<p>Playing with blending modes in Photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt="">
<p>Trying to create an 80's style of glows.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>Drips created using photoshop brushes.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>Creating shapes using repetition.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://facebook.com/zaidamilla"><img src="img/facebook-wrap.png" alt="facebook logo"></a>
<p>©2016 Zaida Josefina Libertini</p>
</footer>
</div>
</body>
</hmtl>
Thank you
3 Answers
Sean T. Unwin
28,690 PointsYou have a typo in the html tags; the 'tm' are switched in your copy. No worries, it happens. :)
Zaida Libertini
2,417 PointsYou are so right...thank you! My eyes must have been switched! lol I re read it many times...Thank you!
Sean T. Unwin
28,690 PointsYou are very welcome. :)
Happy coding!
Sean T. Unwin
28,690 PointsI see that you are missing the opening body tag after the closing header tag. Perhaps you accidentally deleted it when adding the #wrapper div.
edit: had a momentary lapse of reason and confused head and header tags.
Zaida Libertini
2,417 PointsHello, that was just a section of my code starting in my <div> I do have an opening body tag after my head tags.
Here is a copy of my whole html code...thank you for helping, at this point Im really unsure what to do. Im stuck in this video as I cant seem to figure out what the problem is. Ive noticed if I deleted the Div attributes in the html and the background width and margin in css I am able to preview again...therefore the problems should be there?
Here is my entire html code:
<!DOCTYPE html>
<hmtl>
<head>
<meta charset="utf-8">
<title>Zaida Josefina Libertini | Web Designer</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html">
<h1>Zaida Josefina Libertini</h1>
<h2> Web Designer</h2>
</a>
<nav>
<ul>
<li><a href="index.html">Portfolio</a></li>
<li><a href="about.html">About</a></li>
<li><a href="contact.html">Contact</a></li>
</ul>
</nav>
</header>
<div id="wrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with Color.</p>
</a>
</li>
<li>
<a href="img/numbers-02.jpg">
<img src="img/numbers-02.jpg" alt="">
<p>Playing with blending modes in Photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt="">
<p>Trying to create an 80's style of glows.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>Drips created using photoshop brushes.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>Creating shapes using repetition.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://facebook.com/zaidamilla"><img src="img/facebook-wrap.png" alt="facebook logo"></a>
<p>©2016 Zaida Josefina Libertini</p>
</footer>
</div>
</body>
</hmtl>
Sean T. Unwin
28,690 PointsSean T. Unwin
28,690 PointsCould you post some of your code that you think is causing the issue or if you are working on this in Workspaces, create a Snapshot with the code that is causing the blank page so that we may take a closer look?