I need help with this challenge. The instruction is to create a class called smaller-image and use it to resize the image so that it's only 100pixels wide

HTML-CSS
1

Challenge: Size Your Images

Link to the challenge:

2

Please show us the code you’ve tried.

3

16467318691876087785413476273536
164673186918760877854134762735361920Ă—1440 244 KB

I tried this solution and it didn’t work.

4

Please don’t post pictures of code. Please cut and paste it into the message. You can put three backticks on the line before and the and three backticks on the line after the code to ensure that it formats correctly.

5 
  <img class="smaller-image" src="https://bit.ly/fcc-relaxing-cat lying on its back.">

<style>
  .smaller-image{width:100px;}
  .red-text {
    color: red;
  }

  h2 {
    font-family: Lobster, monospace;
  }

  p {
    font-size: 16px;
    font-family: monospace;
  }
</style>

This is my code so far and it keeps telling that I’m wrong.

6

ok sometimes resizing the individual areas will fix the issue. Also make sure there is a space after class=“smaller-image” in the html.

7

[you mean like this?]

<img class= "smaller-image" src="https://bit.ly/fcc-relaxing-cat lying on its back."> <style>   .smaller-image{width:100px;}
8

Please can you show me how to write this code ,I’m tired.
I’ve tried everything I know.

9

I’ve edited your post for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

Pre-formatted-text
Pre-formatted-text1356Ă—380 401 KB

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (’).

10

It looks like you’ve gotten far off the original code. I would recommend hitting Reset All Code and starting over.

And when you post code, post all of it - things can affect other things.

11

the code itself looks right just sometimes the test has a problem, try making the text window wider then you can see if youre missing space or have too many etc…

12

add the class name smaller-image to the existing <img> in the <a href="#">
don’t create another <img>

13

The code really does not look right. Too much has been changed from the original code provided.

1 Like
14

Yes, it will be easier to start over. Press Reset All Code and start with the fresh starter code.

1 Like
15

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