Is this a bug? All three stages require the change of a background-colour property to a background property, but each time I get an error
Hi @laralngn
Check here for farther information because background is a shorthand property.
background A shorthand property for all the background-* properties
background-attachment Sets whether a background image scrolls with the rest of the page, or is fixed
background-blend-mode Specifies the blending mode of each background layer (color/image)
background-clip Defines how far the background (color or image) should extend within an element
background-color Specifies the background color of an element
background-image Specifies one or more background images for an element
background-origin Specifies the origin position of a background image
background-position Specifies the position of a background image
background-repeat Sets if/how a background image will be repeated
background-size Specifies the size of the background images
Be careful with this, you need to understand what any shorthand property does because you could set some properties to its default value if you dont put any value in the shorthand.
Happy coding!!
Are you using Safari? There have been some issues specific to Safari that are causing some tests to fail even though the CSS is correct? If you are using Safari then perhaps try a different browser. If not, then do you have any browser extensions installed that change the colors on the page (such as dark mode extensions). Those can also keep the tests from passing.
Hi @carlosvisator I followed the w3schools link you shared and kept looking further online but still am not able to find something else than the below solution - could you please give another tip perhaps? It’s driving me crazy to not solve it and I feel it’s really obvious
.red {
background: rgb(255, 0, 0);
}
@carlosvisator has good intentions, but he is leading you astray I’m afraid. You did exactly what the instructions for the step asked you to do, you changed the background-color
property to background
. This is correct. As I said, it’s probably an issue with your browser. Did you try a different browser? Maybe you have some extensions installed that are messing with the colors? If so, you might try disabling extensions until you find the one that is causing the issue.
Update: My apologies, I thought you were the original poster but I see that you are not. Regardless, as I said, it is probably a browser issue.
Hi @bbsmooth thanks for the reply, I’m not the original poster but was stuck on this issue and also tried your tips - I’m working on Safari and tried Chrome but it still didn’t mark correctly for me - could be the case for the extension I’ll need to try that also.
@juliafrancesca Safari will definitely have these issues. Are you on a desktop or mobile device. If you are on a mobile device then you probably won’t be able to pass this step with any browser because Apple forces all browsers to use the Safari browser engine on iOS. But if you are on a desktop then other browsers should work. If Chrome isn’t working then it is probably an extension issue.
The final CSS declaration in a declaration block does not technically need a semi-colon but it is a best practice to always include it. So yes, since there is only one declaration in this block then the semi-colon is technically not needed. Are you saying that you have tested this with Safari and it will pass if you leave the semi-colon off?
Ahh. The hint is not saying to leave the semi-colon out. The semi-colon is implied. The hint isn’t giving the actual CSS code to use, just telling you what the value of the background
property should be. Also, the tests don’t test for a semi-colon. They are testing the value of the background
property. The way they are doing that is not quite supported by Safari apparently.
This is a known issue with Safari. There are certain tests, mostly involving color, that fail with Safari even though the CSS is correct. Unless someone stumbles upon a work around, the solution is to use a different browser.
Thanks @bbsmooth and @Geeky_Teen06 for your suggestions - On my macbook I’ve tried disabling any extensions on both Safari and Chrome but it still marks as incorrect, I think I’ll need to accept that it won’t mark as complete.
Are you making any color changes at the operating system level? You might try downloading a fresh version of Firefox and test it there. I’m just guessing at this point. But I can tell you that people have successfully passed this step on macs, just not with Safari.
Also, since you only posted the CSS for this one rule set, I’m assuming that you have not accidentally changed something else in the CSS that would be causing you to fail, such as a missing curly brace or semi-colon somewhere else.
But ya, if it’s too much of a bother then just skip to the next step knowing you got this one right. But you will probably run into similar issues in other courses, so it might be a good idea to get this fixed now.
It worked on Firefox what a relief! I think I may need to update my chrome in that case cos it’s odd it didn’t work there. Thanks again for all your help and tips on this like this I know when I’m stuck, I need to try it on different browsers.
Ahh, if you have a very old version of Chrome then that could indeed be the issue. It may not support the method the tests are using to calculate the color.
Hi
I think I was sleepy when I have read this, also I did not know where she was. But I glad you have helped her.
Happy coding!
This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.