Stuck like a duck in muck

I’m stuck. I have added the class under the style element, and I have added the class under img in the html. My browser is at 100%. I have tried resetting the code multiple times. Is there a secret I am missing? Do I have a glaring typo that would bite me if it were a snake? sos please help.


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

h2 {
  font-family: Lobster, monospace;
}

p {
  font-size: 16px;
  font-family: monospace;
}
</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" src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back."></a>

<div>
  <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>

Which challenge is this?

Size your image css lesson

Also make your styles above your link. its better that way.

I tried this but test still responds that the image should be 100px wide?

Thanks for the tip. I have now adjusted this but the test still responds. “your image should be 100px wide”…

delete the smaller text from your smaller-image text. use only ‘image’ width

When I type your original code into this challenge, it passes. Sometimes things get out of whack. Restart your computer, clear your browser cache, try a different browser. If none of that works, just move on. This happens every now and then.

1 Like

What I meant earlier on is remove the text ‘smaller’ from the “smaller-image” class and use img class

@nzemade.c One of the requirements is using the class smaller-image

Your img element should have the class smaller-image

@alcotta Your code is passing for me as well. We can’t see what browser you are using, but I’d suggest trying the latest version of Chrome or Firefox if you are not already.

2 Likes

Ok, I thought wrongly.