No idea why this isn't working to produce a green border around the cat image


<style>

  .red-text {

    color: red;

  }

  h2 {

    font-family: Lobster, monospace;

  }

  p {

    font-size: 16px;

    font-family: monospace;

  }

  .thick-green-border {

    border-width: 10px;

    border-style: = solid;

    border-color: green;

    

  }

  .smaller-image {

    width: 100px;

  }

</style>

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

<main>

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

  <a href="#"><img class="smaller-image thick-green-border" src="https://cdn.freecodecamp.org/curriculum/cat-photo-app/relaxing-cat.jpg" alt="A cute orange cat lying on its back."></a>

  <div>

    <p>Things cats love:</p>

    <ul>

      <li>cat nip</li>

      <li>laser pointers</li>

      <li>lasagna</li>

    </ul>

    <p>Top 3 things cats hate:</p>

    <ol>

      <li>flea treatment</li>

      <li>thunder</li>

      <li>other cats</li>

    </ol>

  </div>

  <form action="https://freecatphotoapp.com/submit-cat-photo">

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

  </form>

</main>

Hello there @jclauson kindly provide a link to the challenge and although not compulsory you might want to properly format your code starting from the styles up to the image here in the forum so it looks clean and neat as this will help other devs read through faster and be able to help faster as well.

You can make use of the blockquote or the preformatted text buttons in the text editor:

Blockquote

type or paste code here

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.

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

HI @jclauson !

This is not correct syntax

But as mentioned, please also include the challenge link when posting about challenges so we know what you are working on.

This is the long version:

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

You can also write the short version:

border: 10px solid green; 

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