Add Borders Around Elements

1

Tell us what’s happening:

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;
  }

  .smaller-image {
    width: 100px;
  }
  
  .thick-green-border { 
    border-color: green; 
    border-width: 5px; 
    border-style: solid;
  }
</style>

<h2 class="red-text">CatPhotoApp</h2>

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

<p class="red-text">Kitty ipsum dolor sit amet, shed everywhere shed everywhere stretching attack your ankles chase the red dot, hairball run catnip eat the grass sniff.</p>
<p class="red-text">Purr jump eat the grass rip the couch scratched sunbathe, shed everywhere rip the couch sleep in the sink fluffy fur catnip scratched.</p>

Your browser information:

Your Browser User Agent is: Mozilla/5.0 (X11; CrOS x86_64 9460.73.0) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/59.0.3071.134 Safari/537.36.

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

2

This part, take the quotes out of the middle. Multiple classes applied to the same element use the same set of quotation marks. with spaces between the individual class

Should look like this. I didn’t copy the whole line, just the part needed.

<image class = "smaller-image thick-green-border"
1 Like
3

am also struggling with the same thing…it didn’t work

4

Missed the notification of your reply, @JudithMoate did you get your issues sorted out?

5

I am thoroughly confused on this challenge. I have tried several suggestions listed here and on other threads. I cannot for the life of me figure this out. Completely lost and now none of it makes sense. CSS in general is really a stumbling block for me. HTML I could do in my sleep. I have not figured out at all what CSS is trying to do or what each of the parts are trying to instruct. It’s like someone just puts random characters together that make no sense for each outcome. I am very frustrated as I’ve not been able to complete one challenge without assistance and still do not understand how the answer came to be. I’m just copying and pasting others answers without understanding what happened. Is there another resource to break down CSS more for people like me? (Yes…I know this is a two part query here with the answer being one…and then a request for more insight.)

6

Ok…I got thru the challenge…but is there a place where someone explains CSS like to a kindergartner? Because that’s what I feel like. Ugh… Its like how math was for me in hs. Geometry made perfect sense…algebra was like someone thru characters in a bag and shook them up. :frowning:

7

This might help: https://www.w3schools.com/CSS/