Majoirty of Basic CSS course is incompletable

So this is making it difficult to learn CSS as I have to hop in and out of tutorials, often losing track of what i just completed.

The issue is that with both Firefox and Chrome (OSX 10.13) do not recognize appropriate code. If this issue was confined to Firefox, then it would be understandable, but chrome uses Webkit and shouldn’t fall into the same error that Firefox apparently does.

Can we get someone to actually fix this problem? It just makes it harder to learn CSS and appears to be completely unnecessary. I have copied and pasted several solutions but it can not recognize that h2 IS red. It just won’t accept any answer.

Why is this not fixed? This seems to be a systemic issue that the end-user can not fix, and appears to effect the entire course. Additionally, many similar posts on this forum and stack overflow exist and remain unanswered.

This is a REALLY bad look as things stand.

Most times when people have issues with color related challenges, it is because of some extension installed that changes the look. Like dark mode/reader extension.

1 Like

Hello and welcome to the forum :partying_face:!

Where are You having problems?

I know there are some issues with some tutorials (usually they expect the syntax to be exact, whereas we know it’s right regardless), but I (among others) was able to finish the Responsive Web Design Certification on Firefox.

Maybe we can help You here :slight_smile:.

The first 4 appear to not work. I checked a little further ahead and it was still outputting issues. The code is correct. I understand that each tutorial doesn’t have to be completed, but you lose all of your progress every tutorial, which makes things very hard if you have ADHD, like I do. I just want to follow along like the tutorials want me to, but it is impossible as things stand.

https://www.freecodecamp.org/learn/responsive-web-design/basic-css/change-the-color-of-text is the first one, and it is impossible. The following 3 follow suit. I didn’t bother to check all of them because this isn’t my job, but they do not work on firefox and chrome - at least on osx 10.13, which really shouldn’t matter given that this is a web application.

<h2 style="color: red;">CatPhotoApp</h2>

and later on…

<style>
  .red-text {
    color: red;
  }
</style>

I can copy and paste in verified answers and they refuse to work.

I’m literally repeating myself now. It’s not like I’m the only one with these issues.

The challenge you linked to and the three that follows it are all color related challenges.

Again, do you have some extension installed that changes the colors in the browser. Like a dark mode extension? If you do you need to disable it. You can use the fCC dark mode instead, it is under the profile settings.

@lasjorg You were actually helpful, thank you. This was the issue.

I have dark reader installed on both firefox and chrome, yet i do not understand why these interfere with the test to begin with? Shouldn’t the input text just be parsed, instead of relying on rendering the page? That just seems like introducing a point of failure that will be continually broken as more extensions do similar things, in addition to browsers supporting ‘dark-mode’ webpage rendering. That may break things too…

@camperextraordinaire, I already gave you all relevant information. Continuing to ask for the same information didn’t help me at all. Take notes, you just agitated someone who was already aggravated. Enough said.

TL;DR
[Solved]
Don’t use Darkreader, or any other extension that changes how pages are rendered. For some bewildering reason it seems to break all CSS-related challenges. If you find this via google, please spread the word as many instances of this exact question remain unanswered.