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

Posted by Laura Mora
Laura Mora
691 Points

won't center or change background color. Why?

why wont my website photos center or background color change

Joel Hernandez
.a{fill-rule:evenodd;}techdegree
Joel Hernandez
Front End Web Development Techdegree Student 2,571 Points

Hey Laura, anyway you can post your code?

6 Answers

Joel Hernandez
.a{fill-rule:evenodd;}techdegree
Joel Hernandez
Front End Web Development Techdegree Student 2,571 Points

Laura - For the images part, in your HTML code the div id is "wraper" but in your CSS code you are targeting "wrapper," That should fix that part.

For the background color part. Your nav { background: #599a68 } is missing the ; after the hex value to end the statement. Trying fixing those typos to see if it works.

For reference the code should be: HTML <div id="wrapper"> and CSS nav { background: #599a68; }

Laura Mora
Laura Mora
691 Points

Thanks! That fixed it. I guess I just skimmed over those mistakes :)

Stephanie Marson
Stephanie Marson
7,627 Points
Stephanie Marson
Stephanie Marson
7,627 Points

We could also help troubleshoot by seeing the site - if it is live and does not contain personal info....

Laura Mora
Laura Mora
691 Points

I couldn't find the option to add my code on the question. How could I show the site?

Stephanie Marson
Stephanie Marson
7,627 Points
Stephanie Marson
Stephanie Marson
7,627 Points

You could paste the link to the website. If you wanted to add code, use: 3 backticks (```) on the line before and after. If you specify the language after the first set of backticks, that'll help us with syntax highlighting. Hope that helps.

Laura Mora
Laura Mora
691 Points
Laura Mora
Laura Mora
691 Points

'''https://teamtreehouse.com/workspaces/8466112''' I don't think my problem is in the main.css file. I think it's in the index.html file. Any help would be great! thanks :)

Stephanie Marson
Stephanie Marson
7,627 Points
Stephanie Marson
Stephanie Marson
7,627 Points

Laura- Unfortunately, the link you provided is not going to work because it is the link for your treehouse workspace which is specific to your treehouse account. - so we can't see it. It would seem that the only way we can help is for you to provide the code. Please refer to the 'Markdown Cheatsheet' below the "Add an Answer' text box on how to add code and other formatting to your forum responses. Sorry I couldn't be more help.

Laura Mora
Laura Mora
691 Points
Laura Mora
Laura Mora
691 Points 
            <p>
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Laura Mora</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>Laura Mora</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="wraper">
      <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 models 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>
        <img src="img/twitter-wrap.png" alt="Twitter Logo">
        <a href="https://www.facebook.com/profile.php?id=100005404930035"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy; 2013 Laura Mora.</p>
      </footer>
    </div>
  </body>
</html></p>
            ```

I believe the problem is in here but I will attach my css code as well just in case. Thanks for helping :)

 ```css
            <p>a {
 text-decoration: none; 
}

#wrapper {
  max-width: 940px;
  margin: 0 auto;
  padding: 0 5%;
}

#logo {
text-align: center;
margin: 0;
}

a {
  color: #6ab47b;
}

header {
  background: #6ab47b;
  border-color: #599a68;
}

h1, h2 {
color: #fff;
}

nav {
  background: #599a68
}

nav a, nav a:visited {
  color: #fff;
}</p>
            ```