Changing width size in img element

I’m not understanding the instruction for changing the image size of my picture. Not sure where it’s supposed to go . Tried in Style also tried in img element but image is just getting deleted.


e in detail here.

  **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;
}
</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://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" 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>
  **Your browser information:**

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/100.0.4896.127 Safari/537.36

Challenge: Size Your Images

Link to the challenge:

When you use a class to style an image then you have to add information in two places: the image and in the CSS. Look at the <h2> element in the code. A class of red-text is being used to turn it red. Use that as an example of how you can resize the image.

Hello,
I’m lost I think I added the size change correctly to the style portion but I’m not figuring out were in the img element I’m supposed to add the the class . I’ve tried multiple times. There’s something I’m not understanding.
This exercise doesn’t provide a video tutorial . Do you know where I can go to see an example of a class change to an image?
thank you for your help with this.

I think the <h2> example that is already in the HTML is a perfect example of how to do this. Do you understand how that works? If not, please ask a specific question about it. Don’t let the fact that an <h2> is different than a <img>. That makes no difference here, you are still using the same method to make a style change.

It would also help if you pasted your code in here so we could see what you are doing. Don’t forget to wrap your code in triple backticks.


Here is my code.

FYI, posting images of code is not a good idea, it is hard to see and we also can’t see all of your code. Please use the triple back tick method to paste in any further updates.

Compare your <img> to the <h2>. Do you see how the red-text class is added to the <h2>? Does your <img> look the same?

Ok,
thank you.
I figured it out.
Thank you again.

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