# Add border color, border width, border style

**URL:** <https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089>\
**Category:** General\
**Created:** [July 14, 2017, 11:13am UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089 "2017-07-14T11:13:02Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Jaysmart](https://avatars.discourse-cdn.com/v4/letter/j/3be4f8/32.png) [@Jaysmart](https://forum.freecodecamp.org/u/Jaysmart)\
**Post date:** [July 14, 2017, 11:13am UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/1 "2017-07-14T11:13:02Z")

</div>

please i am having issues with setting my image to thick green border with a border style, can someone help with the full code. i would really appreciate it if anyone can help with the full pictures of what the code looks like.[https://www.freecodecamp.org/challenges/add-borders-around-your-elements](https://www.freecodecamp.org/challenges/add-borders-around-your-elements)

---

<div class="post-metadata">

**Author:** ![slamoureux](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/slamoureux/32/131736_2.png) [@slamoureux](https://forum.freecodecamp.org/u/slamoureux)\
**Post date:** [July 14, 2017, 11:53am UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/2 "2017-07-14T11:53:30Z")

</div>

What part are you having trouble with? The image element should look like this:

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

---

<div class="post-metadata">

**Author:** ![shoeb-howlader](https://avatars.discourse-cdn.com/v4/letter/s/c2a13f/32.png) [@shoeb-howlader](https://forum.freecodecamp.org/u/shoeb-howlader)\
**Post date:** [July 14, 2017, 2:06pm UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/3 "2017-07-14T14:06:32Z")

</div>

**Here is the solution of mine**

> ```
> <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:10px solid green;
> }
> </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>
> 
> ```

add class named **thick-green-border** to your img tag and declare a class named **.thick-green-border** in under the style tag. and add border properties.

`

---

<div class="post-metadata">

**Author:** ![Jaysmart](https://avatars.discourse-cdn.com/v4/letter/j/3be4f8/32.png) [@Jaysmart](https://forum.freecodecamp.org/u/Jaysmart)\
**Post date:** [July 14, 2017, 2:07pm UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/4 "2017-07-14T14:07:57Z")

</div>

![](https://global.discourse-cdn.com/freecodecamp/original/3X/d/5/d5454522a0a2dca76aa003c63fe7be8cf681cb10.png)

---

<div class="post-metadata">

**Author:** ![shoeb-howlader](https://avatars.discourse-cdn.com/v4/letter/s/c2a13f/32.png) [@shoeb-howlader](https://forum.freecodecamp.org/u/shoeb-howlader)\
**Post date:** [July 14, 2017, 2:13pm UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/5 "2017-07-14T14:13:10Z")

</div>

you have error in your code.  
**try this:**  
\> .thick-green-border{  
\> border-style:solid;  
\> border-width:10px;  
\> border-color:green;  
\>  
\> }

separate properties with semi-colon. and thick-green is not a color . replace it with green

---

<div class="post-metadata">

**Author:** ![ILM](https://sea3.discourse-cdn.com/freecodecamp/user_avatar/forum.freecodecamp.org/ilm/32/363239_2.png) [@ILM](https://forum.freecodecamp.org/u/ILM)\
**Post date:** [January 17, 2021, 8:48pm UTC](https://forum.freecodecamp.org/t/add-border-color-border-width-border-style/136089/6 "2021-01-17T20:48:13Z")

</div>