Step #49 in Responsive Web Design

HTML-CSS
1

Tell us what’s happening:
Describe your issue in detail here.

**Step 49 asks that I remove the background-color property and change it to background with the value : rgb(255, 0, 0); **

   **Your code so far**

/* file: index.html */
<!DOCTYPE html>
<html>
 <head>
   <meta charset="utf-8">
   <meta name="viewport" content="width=device-width, initial-scale=1.0">
   <title>Colored Markers</title>
   <link rel="stylesheet" href="styles.css">
 </head>
 <body>
   <h1>CSS Color Markers</h1>
   <div class="container">
     <div class="marker red">
     </div>
     <div class="marker green">
     </div>
     <div class="marker blue">
     </div>
   </div>
 </body>
</html>

/* file: styles.css */
h1 {
 text-align: center;
}

.container {
 background-color: rgb(255, 255, 255);
 padding: 10px 0;
}

.marker {
 width: 200px;
 height: 25px;
 margin: 10px auto;
}

 .red {
background: rgb(255, 0, 0);
}

/*In the .red CSS rule, change the background-color property to background.*/

.green {
 background-color: #007F00;
}

.blue {
 background-color: hsl(240, 100%, 50%);
}


   **Your browser information:**

User Agent is: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.4 Safari/605.1.15

Challenge: Step 49

Link to the challenge:

2

Are you using a browser extension that changes the colors on the page, such as a dark mode extension? If so, then you’ll need to disable it to pass any steps that test colors on the page. Otherwise, I would try a different browser.

1 Like
3

Thanks for responding! but sadly no browser extension to my knowledge how would I double check?

4

Maybe google "check extensions for " and then whatever browser you are using. Did you try using a different browser real quick to see if that fixed the problem?

5

change background-color to background.

6

I am running into this same issue on safari only, no style extensions, no content blockers. User agent is:
[Mozilla/5.0 (Macintosh; Intel Mac OS X 10_15_7) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/15.5 Safari/605.1.15]

when I load up the challenge link in firefox it works as expected and allows me to proceed.

7

Yep, there are some known issues with Safari and FCC. Probably best to use Firefox, Chrome, or Edge instead. Or just put up with the fact that some of these steps aren’t going to pass even though you have the right code.

8

it works on most challenges. with the new curriculum these are the first I am encountering where it doesnt.

While I agree that development work should generally be done anywhere other than safari I still think this issue deserves attention. There are ipad-only users out there who do not get the benefit of changing their browser and would otherwise be able to use freecode camp fine. (which I tested and the issue does replicate on ipad same as macOS)

worth noting this happens to me on #60 as well.

9

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.