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
Jerry Flores
330 PointsCSS not working. When I add the #wordwrapper to the html and then go into main.css and enter the margin nothing happens.
here's my html- followed by the CSS entries.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jerry Flores | DVOP</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id=logo>
<h1>Jerry Flores</h1>
<h2>DVOP</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="wordwrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with color and texture.</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 something new.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>drips created in photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>more texture.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://twitter.com/j_f52"><img src="img/twitter-wrap.png" alt="twitter logo"></a>
<img src="img/facebook-wrap.png" alt="facebook logo">
<p>© 2014 Jerry Flores.</p>
</footer>
</div>
</body>
</html>
a { text-decoration: none; }
wrapper {
max-width: 940px; margin: 0 auto; padding: 0 5%; }
8 Answers
Marco Sinor
1,583 PointsCheck the name of your div. I see "#wordwrapper" in your original question and "wrapper" in the css you posted
Atanas Sqnkov
14,981 PointsJerry, to post a code fragment here on the Treehouse forums you must wrap it in THREE(3) ` , not four as stated above by Sara. Just a tiny mistake there.
Despite that, your code is not valid HTML markup.You only have a doctype declared, followed by simple text.
Sara Read
10,476 PointsHi Jerry,
Is this all of your html?
Jerry Flores
330 PointsHi Sara, thanks for responding. I posted my whole html but I just noticed the post converted it. Let me try again.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jerry Flores | DVOP</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id=logo>
<h1>Jerry Flores</h1>
<h2>DVOP</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="wordwrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with color and texture.</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 something new.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>drips created in photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>more texture.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://twitter.com/j_f52"><img src="img/twitter-wrap.png" alt="twitter logo"></a>
<img src="img/facebook-wrap.png" alt="facebook logo">
<p>© 2014 Jerry Flores.</p>
</footer>
</div>
</body>
</html>
Jerry Flores
330 PointsI don' know how to post it without it being converted.
Sara Read
10,476 PointsTry using four ` at the beginning and end of the code.
Jerry Flores
330 Points''''<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jerry Flores | DVOP</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id=logo>
<h1>Jerry Flores</h1>
<h2>DVOP</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="wordwrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with color and texture.</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 something new.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>drips created in photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>more texture.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://twitter.com/j_f52"><img src="img/twitter-wrap.png" alt="twitter logo"></a>
<img src="img/facebook-wrap.png" alt="facebook logo">
<p>© 2014 Jerry Flores.</p>
</footer>
</div>
</body>
</html>''''
Jerry Flores
330 PointsThank you all for replying. Here is the html followed by the CSS.main.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Jerry Flores | DVOP</title>
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
</head>
<body>
<header>
<a href="index.html" id=logo>
<h1>Jerry Flores</h1>
<h2>DVOP</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="wordwrapper">
<section>
<ul>
<li>
<a href="img/numbers-01.jpg">
<img src="img/numbers-01.jpg" alt="">
<p>Experimentation with color and texture.</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 something new.</p>
</a>
</li>
<li>
<a href="img/numbers-09.jpg">
<img src="img/numbers-09.jpg" alt="">
<p>drips created in photoshop.</p>
</a>
</li>
<li>
<a href="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt="">
<p>more texture.</p>
</a>
</li>
</ul>
</section>
<footer>
<a href="http://twitter.com/j_f52"><img src="img/twitter-wrap.png" alt="twitter logo"></a>
<img src="img/facebook-wrap.png" alt="facebook logo">
<p>© 2014 Jerry Flores.</p>
</footer>
</div>
</body>
</html>
```a { text-decoration: line-through; }
wordwrapper {
max-width: 940px: margin: 0 auto; padding: 0 5%; }
logo {
text-align: center; margin: 0; }```