How to Add Borders Around your Elements

Back End Help
#1

Your img element should have the class thick-green-border.

Give your image a border width of 10px.

Give your image a border style of solid.

The border around your img element should be green.

I need help on solving these problems.

.red-text { color: green; }

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100x;
}

CatPhotoApp

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

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

```

Link to the challenge:
https://www.freecodecamp.org/challenges/add-borders-around-your-elements

#2

There are two things you need to do: create a CSS class that gives the green border, and apply this class to your img (the picture of the cat).

To create the CSS class, you can do it similar to what the tutorial shows in the yellow example. Instead of adding to your CSS classes the following:

.thin-red-border {
    border-color: red;
    border-width: 5px;
    border-style: solid;
 }

change .thin-red-border to .thin-green-border and adjust the border-color and border-width values to the values that the tutorial asks you for.

Then apply this class to the HTML <img> element that has your cat photo.

#3

where do I put the CSS class?

#4

You put in within the <style></style> tags, same as you have been doing for other CSS classes.

#5

I put the CSS style within the tags and it didn’t work.

.red-text { color: red; }

h2 {
font-family: Lobster, Monospace;
}

p {
font-size: 16px;
font-family: Monospace;
}

.smaller-image {
width: 100px;
}

.thick-green-border{
border-color: green;
border-width: 10px;
border-style: solid;
}

CatPhotoApp

A cute orange cat lying on its back.

Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.

Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.

.