Resize img class width in css

Tell us what’s happening:

I cannot resize the Img with class=“Smaller-image” to a width of 100px in css

Your code so far

<link href="" rel="stylesheet" type="text/css">
.red-text {
  color: red;

h2 {
  font-family: Lobster, monospace;

.smaller-image {
 width: 100px;

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

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

<img class="smaller-image" src="" alt="A cute orange cat lying on its back." width="100">

  <p>Things cats love:</p>
    <li>cat nip</li>
    <li>laser pointers</li>
  <p>Top 3 things cats hate:</p>
    <li>flea treatment</li>
    <li>other cats</li>

<form action="">
  <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>

Your browser information:

User Agent is: Mozilla/5.0 (iPhone; CPU iPhone OS 13_5_1 like Mac OS X) AppleWebKit/605.1.15 (KHTML, like Gecko) Version/13.1.1 Mobile/15E148 Safari/604.1.

Challenge: Size Your Images

Link to the challenge:

Does it say why the code fails? Because when I copy your solution and run the tests here, it passes. Even though you’ve removed the anchor tag around the image and set the width in your CSS and also inline in your img tag.

If you’re using Safari, there is a bug with this challenge at the moment. (A fix has been written, but hasn’t made it through the whole deployment process yet.) You can use another browser or just skip it.

Use Google Chrome browser. Your code is ok for me.

Actually I was using safari but when I tried it on chrome pc, it worked. Thanks Guys

1 Like