15/21 Background Check, error says you didn't add a property, but you did!


#1

Seeing one of these error messages?

  • set the body's "background-size" to "cover"
  • expected body to have its background-position style equal to 50% 50% but got 0% 0%
  • expected body to have its background-repeat style equal to no-repeat but got
    repeat
  • expected body to have its background-attachment style equal to fixed but got scroll

tl;dr : Put your background: url(' ....'); BEFORE any other background- properties.


For most of these CSS properties that we are learning about, the order in which you place them when you are building your code does not have any effect on the final appearance of your web page. BUT, there are some properties that are special, and where you place them does matter.

background is one of the special properties. It is shorthand property that can save you time, unless you don't know about its special power and then it will have you pulling your hair out.

background is a short form for several other related properties, some of which are important to us in this exercise. Your background: url(' ... '); line also sets the default values for these related properties. Here are four of these default values that will affect us:

background-position: 0% 0%
background-size: auto auto
background-repeat: repeat
background-attachment: scroll

If you place your background: url(' ....'); AFTER you have explicitly declared those properties then they will all be replaced by their default values. The exercise's code checker will now report your code as being incorrect.

More reading here, if you are interested.


I am doing it right but it says i am doing wrong
15. Background Check
I cannot advance and I am pretty sure I have the code correct!
17/21 border needs to be set to 0 error. (I have it right I believe)
Glitch All About Me website Lesson 15
What iong wih this
They said "try changing background to cover" and I am confused what they mean by that
Step 15 in the About You. Background error message says I have 50/50 and I need 50
Trouble with making a web page. What am I doing wrong?
#2

#7

not working its not the right answer


#8

Did you want help with this?


#9

I have done and tried everything, but it always comes up an error message. I am at 15/21. Plz help me asap!! :wink: :grinning:


#10

I would like to see what you have tried.


#11

ok, well, so I tried to do this:

background-size: cover;
background-position: center center;
background-repeat: no-repeat;
background-attachment: fixed;
/* The rest of your body style */

and so still this is the error message i get,
:no_entry_sign: Oops, try again. expected body to have its background-position style equal to 50% 50% but got 50% ,

what should i do? Thank u in advance to anyone that helps me. :grinning:


#12

Do you happen to be using IE as your browser?


#13

Yes, I'm using Internet Explorer. Could it affect the program in any way?


#14

This is a known bug:

15/21 - IE gives Expected body to have its background-position style equal to 50% 50% but got ....

  • Workaround 1: use background-position: 50% 50%;
  • Workaround 2: use a different browser.

#15

Thanks for the reply. It still did not work. This is what I have now. I am using Google Chrome as the browser, so that is not the problem ( based on another post I saw about IE) . Is there a way for me to get the correct code in the web site? Thanks for your help. I also got an error message about limegreen...


<!DOCTYPE html> <head>
<style> 
body { 
      background: url("https://codecademy-content.s3.amazonaws.com/courses/web-beginner-en-3pc6w/images/splash.jpg");
      text-align: center;
      color: white;
      font-family: Helvetica;
      background-size: cover;
      background-position: center center
      background-repeat: no-repeat;
      background-attachment: fixed
    } 
</style>
</head>
   <body>
<!-- I'm a comment. You won't actually see me on the web page.
     You should write your header in the line below me! -->
 <img src="https://codecademy-content.s3.amazonaws.com/courses/web-beginner-en-3pc6w/images/avatar.jpg" height="250" width="250">  Jeanenne</h>
     <p> Hello! I am learning how to make my very own web page! I really like spaghetti, mysteries, and reading. </p>
     
<input type="email" placeholder="Your Email">
<input type="submit">
</body>


#16

You are missing a semicolon at the end of this line:

background-position: center center

#17

It worked!! Thanks so much for your guidance.


#20

I am also getting that 50% 0% thing even though I have background url before everything else. I use mozilla firefox. Please help me.


#21