Help with "Sizing Your Images" Exercise

HTML-CSS
1

Hi all!

I’m a beginner and having an issue creating the CSS styling for an image as instructed to 100px with the “smaller-image” class. Here is the URL for the page: https://learn.freecodecamp.org/responsive-web-design/basic-css/size-your-images

I believe the code I need to put on the top of the page’s CSS element is:

.red-text { color: red; }

h2 {
font-family: Lobster, monospace;
}

p {
font-size: 16px;
font-family: monospace;
}
img {
smaller-image
width: 100px;
}

2

That was close!

Actually you need to delcare smaller-image class separately not inside your img style. For ex.

<style>
  .larger-image {
    width: 500px;
  }
</style>
3

Hey Phil! Thanks for your response. I understand the correct code but I can’t seem to find the correct place for it. Here is the correct code:

.smaller-image { width: 100px; }

I’ve tried it in every single section of the code, but it is still not working? What might be wrong?

4

Great.

Now that you have the style you can apply this class to the image.

5

Do anyone wnows how to go trough the lesson when they say that the browser zoom need to be at 100% ? I have 100% and its still not leting me go trough this lesson .Its about .:
Due to browser implementation differences, you may need to be at 100% zoom to pass the tests on this challenge.

6

bro you create a class .smaller-image{ width: 100px;} inside the style element and then this class use in img element. If you don’t understnad what i’m saying so don’t worry i see you code below:

.smaller-image{
width: 100px;
}

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