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 seth hinkle
seth hinkle
1,090 Points

I have my main.css connected to index.html, certain changes are there, but the images aren't centered. Bullet points.

My main.css is connected to index.html, my my body background color works, the logo wrap works except adding color, and my div element wont change color. Also, still see. Bullet points. Please help!

Chyno Deluxe
Chyno Deluxe
16,936 Points

Can you please post your HTML and CSS so we can take a closer look.

How to post your code:

seth hinkle
seth hinkle
1,090 Points

<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>Seth Hinkle | Designer></title> <link rel="stylesheet" href="css/normalize.css"> <link rel="stylesheet" href="css/main.css"> </head> <div> <body> <header> <a href="index.html" id="logo"> <h1>Skare Krow Design Inc</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">Contacts</a></li> </ul> </nav> </header> <section> <ul> <li> <a href="image02/dead tree.jpg"> <img src="image02/dead tree.jpg" alt=""> <p>Tattoo Design Of A Dead Oak Tree.</p> </a> </li> <li> <a href="image02/Sad Donald Duck.jpg"> <img src="image02/Sad Donald Duck.jpg" alt=""> <p>Tattoo of a sad looking Donald Duck, designed by Seth Mosby Hinkle.</p> </a> </li> <li> <a href="image02/Rose Portrait.jpg"> <img src="image02/Rose Portrait.jpg" alt=""> <p>A beautiful Rose Portrait tattoo, designed by Rachel Hinkle.</p> </a> </li> <li> <a href="image02/Clown Moon.jpg"> <img src="image02/Clown Moon.jpg" alt=""> <p>Tattoo of a Festive Clown Moon, done by Seth Mosby Hinkle.</p> </a> </li> <li> <a href="image02/Wikked Iron Cross.jpg"> <img src="image02/Wikked Iron Cross.jpg" alt=""> <p>Tattoo of a Sinister Iron Cross, designed by Seth Mosby Hinkle.</p> </a> </li> </ul> </section> <footer> <a href="http://twitter.com/skrow81"><img src="img/twitter-wrap.png" alt="Twitter logo"></a> <a href="http://facebook.com/seth.hinkle2"><img src="img/facebook-wrap.png" alt="Facebook logo"></a> <p>© Seth Mosby Hinkle.</p> </footer> </body> </div> </html>

That my index.html

this is my main.css

a { text-decoration: none; }

wrapper {

max-width: 940px; margin: 0 auto; padding: 0 5%; background: yellow; }

logo {

text-align: center; margin: 0; }

body { background-color: grey; }

the logo wrap works except when i try to change the background color. the wrapper does not work, the body selector works fine.

2 Answers

Chyno Deluxe
Chyno Deluxe
16,936 Points

Ok. i just viewed your code and i have figured out the problem. Some changes will need to be made on your HTML and CSS. Your HTML is missing the id="wrapper". I assume it is suppose to go on the section tag. View below.

<section id="wrapper">

Now on your CSS you are missing the id tags '#' on your wrapper and logo. This is why you aren't able to render your changes to those elements. View below.

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

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

I hope this helps. If my answer helped solve your problem please be sure to mark my answer as the best answer. If you have any questions please feel free to ask.

seth hinkle
seth hinkle
1,090 Points

Dont know they didnt show up from copying, but the hashtags are there. now do you know why my logo still wont change background color? Everything else is working fantastic now. Thanks

Chyno Deluxe
Chyno Deluxe
16,936 Points

The CSS you provided didn't have a background color on the logo but you can include it to your #logo like this.

#logo {
  display: block;
  text-align: center;
  margin: 0;
  background-color: red;
}

In this case you would need to display #logo as a block element in order for the background color to be visible. than you can add the background color you want.

seth hinkle
seth hinkle
1,090 Points
seth hinkle
seth hinkle
1,090 Points

tried turning into a block, but still not allowing for change of background color.