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

HTML

Posted by Swag Baggity
Swag Baggity
951 Points

White Background, unchangable, HTML

I've been troubleshooting it myself for about a week or two, but I can't seem to remove this white background. I attempted to recolor the white background, but it just stays the same. It happened very suddenly and for seemingly no reason. There are no white colors in my code.

8 Answers

Tomas Ferruelo
PLUS
Tomas Ferruelo
Courses Plus Student 10,412 Points
Tomas Ferruelo
Tomas Ferruelo
Courses Plus Student 10,412 Points

I agree, having access to the code would help.

Cena Mayo
Cena Mayo
55,236 Points
Cena Mayo
Cena Mayo
55,236 Points

Looks like the issue is with the empty font-family: in your body declaration. Removing that will give you the black background-color you're looking for.

```body { font-family: background-color: #000000; color: #999; }

Cena Mayo
Cena Mayo
55,236 Points
Cena Mayo
Cena Mayo
55,236 Points

Also, this declaration:

back { color: #000000 }

isn't valid.

Jeff Busch
Jeff Busch
19,287 Points
Jeff Busch
Jeff Busch
19,287 Points

Hi Swag Baggity,

At the end of your css you have selected body. In there you have a rule font-family: and that's it. No value or closing semi-colon; this confuses the web browser.

Jeff

Cena Mayo
Cena Mayo
55,236 Points
Cena Mayo
Cena Mayo
55,236 Points

Hi Swag,

Would you mind posting the code you're referring to? See the Markdown Cheatsheet linked to below the comment form for how to do this (basically, enclose the code in a beginning ``` (3 backticks, located to the left of the numeral 1 key) and another 3 backticks at the end of the code.)

Tomas Ferruelo
PLUS
Tomas Ferruelo
Courses Plus Student 10,412 Points
Tomas Ferruelo
Tomas Ferruelo
Courses Plus Student 10,412 Points

I agree, having access to the code would help.

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points 
<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Ricitania Concepts+Unreleased Content</title>
    <link rel="stylesheet" href="css/normalize.css"> 
    <link href='http://fonts.googleapis.com/css?family=Trade+Winds|Shadows+Into+Light|Metal+Mania|Nova+script|Orbitron' rel='stylesheet' type='text/css'>
    <link href='http://fonts.googleapis.com/css?family=Press+Start+2P' rel='stylesheet' type='text/css'>
    <link rel="stylesheet" href="css/main.css">
  </head>
  <body>
    <header>
      <h1>--/Ricitania Concepts\--</h1>
      <h2>-\Unreleased Content/-</h2>
      <h3>/--This site is used to publish unreleased and conceptual ideas
          from Ricitania. This includes mostly artwork.--\
      </h3>
      <nav>
      <ul>
        <li><a href="index.html">Concepts + Unrelease Work.</a></li>
        <li><a href="ricitania.html">Ricitania</a></li>
        <li><a href="devteam.html">Dev Team</a></li>
      </ul>
      </nav>
    </header>
    <div id="doge">
      <section>
      <ul>
        <p>4/23/2014 -
          As of right now, we have literally nothing. We have no concepts, ideas, nothing. We have been talking ABOUT talking about getting concepts, but haven't even done that
        </p>
        <li>
        <a href="img/Ricitania.jpg"></a>
        <img src="img/Ricitania.jpg">
        <p>Quick thing for Ricitania.</p>
        </li>
           <li>
        <a href="img/Ricitania Wallpaper.jpg"></a>
        <img src="img/Ricitania Wallpaper.jpg">
        <p>HD Ricitania Wallpaper.</p>
        </li>
           <li>
        <a href="img/Ricitania Logo Dark.png"></a>
        <img src="img/Ricitania Logo Dark.png">
        <p>Logo.</p>
        </li>
      </ul>
      </section>
      <footer>
        <a href="https://www.youtube.com/watch?v=dQw4w9WgXcQ"><img src="img/twitter-wrap.png" alt="Twitter Logo"></a>
        <a href="http://www.youtube.com/watch?v=sd4bqmP_460"><img src="img/facebook-wrap.png" alt="Facebook Logo"></a>
        <p>&copy;Ricitania</p>
      </footer>
      </div>
    </body>
</html>

/****************************
/****************************
GENERAL
****************************/

a {
  text-decoration: none;
}

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

back {
  color: #000000
}

h1 {
  font-family: 'Press Start 2P';
  margin: 0px 0;
  font-size: 2em;
  font-weight: normal;
  line-height: 1em;
}

h2 {
  font-family: 'Press Start 2P';
  font-size: 1em;
  margin: 1px 0 0;
  font-weight: normal;
  font-stretch: expanded;
}

h3 {
  font-family: 'Press Start 2P';
  color: #000;
  font-size: 1em;
  font-weight: normal;
}

ul {
  font-family: 'Press Start 2P';
}

a {
  color: #000000;
}

header {
  background: #661111;
  border-color: #000000;
}

h1, h2 {
  color: #000;
}

nav {
  background: #441111;
}

nav a, nav a:visited {
  color: #ff0000;
}

nav a.selected, nav a:hover {
  color: #7777ff
}

body {
  font-family:
  background-color: #000000;
  color: #999;
}

footer {
  font-size: 0.75em;
  text-align: center;
  padding-top: 50px;
  color: #ccc
}

Don't know if this is what you meant. Sorry if it's messy.

Swag Baggity
Swag Baggity
951 Points
Swag Baggity
Swag Baggity
951 Points

Thank you all so much, you've been a great help.