"Your img element should have the class smaller-image."?

Tell us what’s happening:
Describe your issue in detail here.
Keep getting a message saying " Your img element should have the class smaller-image". i literally have copied and pasted my code from multiple different people that have answered this problem, really dont understand what im doing wrong and im getting pretty frustrated lol. Any answers would be greatly appreciated.

  **Your code so far**

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

h2 {
  font-family: Lobster, monospace;
}

p {
  font-size: 16px;
  font-family: monospace;
}
.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 src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back." class="smaller-image"></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="/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 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/97.0.4692.99 Safari/537.36

Challenge: Size Your Images

Link to the challenge:

Reset the code and try it again. You may also want to turn off any extensions you have on your browser as that can impact some challenges. Also, typically, the class is added at the front of the tag, after it’s opening. (i.e., <img class="..." ...>

Hi @throwbands,

You change the url for the image, that’s why your test fail.

Your code:

<a href="#">
  <img src="https://bit.ly/fcc-relaxing-cat" alt="A cute orange cat lying on its back." class="smaller-image">
</a>type or paste code here

The original one:

<a href="#">
  <img src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back.">
</a>

You can reset the code as suggested or just update it, the src attribute.

1 Like

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