This code works in Firefox for Windows 10 but not Firefox for Ubuntu...Why?

HTML-CSS
1

Tell us what’s happening:

Your code so far


<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">
<style>-color:
.silver-background {
  background-color: silver;}
.red-text {
  color: red;
}

h2 {
  font-family: Lobster, monospace;
}

p {
  font-size: 16px;
  font-family: monospace;
}

.thick-green-border {
  border-color: green;
  border-width: 10px;
  border-style: solid;
  border-radius: 50%;
}

.smaller-image {
  width: 100px;
}
</style>

<h2 class="red-text">CatPhotoApp</h2>
<main>
<p class="red-text">Click here to view more <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

<div class="silver-background">
  <p>Things cats love:</p>
  <ul>
    <li>cat nip</li>
    <li>laser pointers</li>
    <li>lasagna</li>
  </ul>
  <p>Top 3 things cats hate:</p>
  <ol>
    <li>flea treatment</li>
    <li>thunder</li>
    <li>other cats</li>
  </ol>
</div>

<form action="https://freecatphotoapp.com/submit-cat-photo">
  <label><input type="radio" name="indoor-outdoor" checked> Indoor</label>
  <label><input type="radio" name="indoor-outdoor"> Outdoor</label><br>
  <label><input type="checkbox" name="personality" checked> Loving</label>
  <label><input type="checkbox" name="personality"> Lazy</label>
  <label><input type="checkbox" name="personality"> Energetic</label><br>
  <input type="text" placeholder="cat photo URL" required>
  <button type="submit">Submit</button>
</form>
</main>

Your browser information:

User Agent is: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:85.0) Gecko/20100101 Firefox/85.0.

Challenge: Give a Background Color to a div Element

Link to the challenge:

2

You have a typo here.

5

After fixing the issue @JeremyLT pointed out it is passing for me with FF on Fedora (Linux).

6

Thanks so much for pointing that out, Jeremy. I fixed the typo but am still unable to get a silver background. (I tried to cut and paste the new code into here a couple times but it keeps bringing up the picture of the cat et al and not the complete code!)

7

What’s your updated code? It works for me if I delete those 7 stray characters, and I’m using Firefox 85 on Ubuntu as well.

8 
<link href="https://fonts.googleapis.com/css?family=Lobster" rel="stylesheet" type="text/css">

<style> color:

.silver-background {

background-color: silver;}

.red-text {

color: red;

}

h2 {

font-family: Lobster, monospace;

}

p {

font-size: 16px;

font-family: monospace;

}

.thick-green-border {

border-color: green;

border-width: 10px;

border-style: solid;

border-radius: 50%;

}

.smaller-image {

width: 100px;

}

</style>

<h2 class="red-text">CatPhotoApp</h2>

<main>

<p class="red-text">Click here to view more <a href="#">cat photos</a>.</p>

<a href="#"><img class="smaller-image thick-green-border" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

<div class="silver-background">

<p>Things cats love:</p>

<ul>

<li>cat nip</li>

<li>laser pointers</li>

<li>lasagna</li>

</ul>

<p>Top 3 things cats hate:</p>

<ol>

<li>flea treatment</li>

<li>thunder</li>

<li>other cats</li>

</ol>

</div>

<form action="https://freecatphotoapp.com/submit-cat-photo">

<label><input type="radio" name="indoor-outdoor" checked> Indoor</label>

<label><input type="radio" name="indoor-outdoor"> Outdoor</label><br>

<label><input type="checkbox" name="personality" checked> Loving</label>

<label><input type="checkbox" name="personality"> Lazy</label>

<label><input type="checkbox" name="personality"> Energetic</label><br>

<input type="text" placeholder="cat photo URL" required>

<button type="submit">Submit</button>

</form>

</main>
9

You still have the stray characters. This entire thing is breaking your CSS.

10

Ahh, I see it now. Fixed it! Thanks so much!

Good to know it’s me and not the OS, honestly!

1 Like
11

Every once in a while we’ll have a browser based issue, but its usually not Firefox that is the offending party but rather Safari.

12

I will keep that in mind for next time. This also happened to me during the HTML tutorial but I’m sure now that it was my mistake there too! Thanks so much for the quick reply and also for not making me feel like a idiot :wink:

13

Bugs happen to us all :smiley:

1 Like
15

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