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 trialnydia subur
1,459 Pointsbackground not changing despite everything right (i suppose)
Nicholas Vogel
12,318 PointsIt's best if you copy and paste your code, we can't see your specific workspaces window.
nydia subur
1,459 Pointsindex.html:
<!DOCTYPE html> <html> <head>
<meta charset ="utf-8">
<title> Nydia | Designer </title>
<link rel"stylesheet" href="css/normalize.css">
<link rel"stylesheet" href="css/main.css">
</head>
<body> <header> <a href="index.html"> <h1> Nydia Subur </h1> <h2>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"image cant be found">
<p> Experimentation with colors and texture</p>
</a>
</li>
<li>
<a href ="img/numbers-02.jpg">
<img src="img/numbers-02.jpg" alt"image cant be found">
<p> playing with blending modes</p>
</a>
</li>
<li>
<a href ="img/numbers-06.jpg">
<img src="img/numbers-06.jpg" alt"image cant be found">
<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"image cant be found">
<p> Drips created using photoshop brushes</p>
</a>
</li>
<li>
<a href ="img/numbers-12.jpg">
<img src="img/numbers-12.jpg" alt"image cant be found">
<p> creating shapes using repetition</p>
</a>
</li>
</ul>
</section>
</div>
<footer>
<a href="https://twitter.com">
<img src="img/twitter-wrap.png" alt="twitter logo">
</a>
<a href ="https://www.facebook.com/profile.php?id=100008477770564">
<img src="img/facebook-wrap.png" alt ="facebook logo">
</a>
<p>© nydia subur's private property </p>
</footer>
</body>
</html>
main.css:
a{ text-decoration:none; }
wrapper{
max-width: 940px; margin:0 auto; padding: 0, 5%; background: grey;
}
4 Answers
annabrandt
6,094 Pointsyour links in the HTML I think should be coded like this: <link href="css/normalize.css"> <link href="css/main.css"> Hope it will work!
Ryan S
27,276 PointsHi Nydia,
I notice that in your padding property you have a comma separating the 0 and 5%. This might be why your background isn't showing. Syntax errors and typos on one line will often cause the next property inside the rule to not work properly.
Also, don't forget the hash symbol (#) when targeting id's, otherwise none of your css properties will apply.
#wrapper {
max-width: 940px;
margin: 0 auto;
padding: 0 5%; /* Remove the comma
background: grey;
}
nydia subur
1,459 Pointsremoved the comma, still no changes
Ryan S
27,276 PointsDid you also remember to add the hash symbol to #wrapper? It was missing in your original code.
nydia subur
1,459 Pointsyes. Ive even tried deleting all my code in main.css and only wrote:
body{ background-color: orange; }
but nothing happens. Seems like the problem is with connecting the html to my css .. but again i suppose I've written everything right
Ryan S
27,276 PointsHi Nydia,
I think I figured out your issue, however I still had some problems in getting it to work in workspaces. You are missing the equal signs between "rel" and "stylesheet" in your <link> elements:
<link rel="stylesheet" href="css/normalize.css">
<link rel="stylesheet" href="css/main.css">
But for some reason the workspace wouldn't save the changes I made. Even if I closed and reopened my workspace, it would still revert back to the missing equal signs. Maybe it is an issue with Firefox on my end, or the way I created a new workspace to try and troubleshoot this.
But if adding the equal signs still doesn't work for you, try doing the following (this worked for me):
1) Clear your browser cache
2) Delete both <link> elements, save index.html and close workspaces, and close your previewed web page.
3) Reopen workspaces, and add in the correct <link> elements with the equal signs (as shown above), save your file and preview the web page.
It should work after this.
Another thing I noticed, aside from the css syntax errors, is that you are missing an equal sign in your "Contact" href attribute.
Hopefully this works for you.
codebyamir
12,108 Pointscodebyamir
12,108 PointsCan you post your code?