# Bacground image Question

**URL:** <https://forum.codewithmosh.com/t/bacground-image-question/26784>\
**Category:** HTML/CSS\
**Created:** [May 18, 2024, 6:10pm UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784 "2024-05-18T18:10:36Z")\
**Posts on this page:** 5\
**Page:** 1

<div class="post-metadata">

**Author:** ![techytony](https://avatars.discourse-cdn.com/v4/letter/t/e9bcb4/32.png) [@techytony](https://forum.codewithmosh.com/u/techytony)\
**Post date:** [May 18, 2024, 6:10pm UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784/1 "2024-05-18T18:10:36Z")

</div>

I have a background image in the body, I added this background using CSS

I have a button added as well, there for when i try to adjyst the brightness everything in the body gets affected.

My question is, how can add a class to this specifc background image? This is thwoing me off

---

<div class="post-metadata">

**Author:** ![UniqueNospaceShort](https://sea2.discourse-cdn.com/flex020/user_avatar/forum.codewithmosh.com/uniquenospaceshort/32/1814_2.png) [@UniqueNospaceShort](https://forum.codewithmosh.com/u/UniqueNospaceShort)\
**Post date:** [May 19, 2024, 2:49pm UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784/2 "2024-05-19T14:49:41Z")

</div>

Hi  
I don’t understand what you are trying to do.  
Isn’t your image already in a class if you added it wia CSS ?  
Cheers.

---

<div class="post-metadata">

**Author:** ![techytony](https://avatars.discourse-cdn.com/v4/letter/t/e9bcb4/32.png) [@techytony](https://forum.codewithmosh.com/u/techytony)\
**Post date:** [May 19, 2024, 3:23pm UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784/3 "2024-05-19T15:23:32Z")

</div>

Ok, so the image was added using the background-image property using CSS, the class was the “body” I have a button i have styled, any changes i make to the body are impacted opacity or brightness for example,

Im assuming if i can create a class for the imgae and not just the whole body, only the background image will be afftected and not the other elements in the body.

Hope this helps.

---

<div class="post-metadata">

**Author:** ![eleanorjohnson](https://avatars.discourse-cdn.com/v4/letter/e/977dab/32.png) [@eleanorjohnson](https://forum.codewithmosh.com/u/eleanorjohnson)\
**Post date:** [May 20, 2024, 7:14am UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784/4 "2024-05-20T07:14:29Z")

</div>

Hey, techytony! I have read your question regarding the problem you are facing. I got to know this when I asked someone to [take my online class for me](https://takemyclass.us.com/) To add a class to the specific background image in CSS, wrap a div around your content, apply the background image to this div, and adjust its brightness using CSS filters. This isolates the effect from other elements.

---

<div class="post-metadata">

**Author:** ![techytony](https://avatars.discourse-cdn.com/v4/letter/t/e9bcb4/32.png) [@techytony](https://forum.codewithmosh.com/u/techytony)\
**Post date:** [May 20, 2024, 1:18pm UTC](https://forum.codewithmosh.com/t/bacground-image-question/26784/5 "2024-05-20T13:18:48Z")

</div>

This is exactly what I was looking for! Thank you - I do have a follow up question regarding CSS, and background images, is there a one line peice of code that will aloow the imgae to fit he screen corner to corner.

I tired background-size: cover;  
Not sure extaly what size that should be to achive this, I guess im confused on the syntax as well.

Any help here, please an ty!
