WuTangForever Posted January 5, 2022 Share Posted January 5, 2022 (edited) Site URL: https://defendingabuse.com/ I apologize if the title is confusing, I'm not sure how else to word it. I am trying to create a half background with an opacity of ~.5 to insert some text into. I need the background to go in front of the background photo that I have, obviously. I have provided an example of exactly what I am talking about below. I use CSS background properties relatively often but I am still a noob and every time I have tried it will not work. The photo below is my site with what I have so far. I made it red so its easy. Here is the current code: section[data-section-id="618a8d101b196313d7d86ae0"]{ .section-background{ background-color: red; padding-left: 50%; } } When I try and add opacity, it affects the entire section. I only want it to affect the red half! Please help! Edited January 6, 2022 by WuTangForever Added info Link to comment
tuanphan Posted January 7, 2022 Share Posted January 7, 2022 Try this code section[data-section-id="618a8d101b196313d7d86ae0"] { .section-background { margin-left: 50%; position: absolute; } & { background-color: rgb(255, 0, 0, 0.5) !important; } } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
WuTangForever Posted January 7, 2022 Author Share Posted January 7, 2022 (edited) 2 hours ago, tuanphan said: Try this code section[data-section-id="618a8d101b196313d7d86ae0"] { .section-background { margin-left: 50%; position: absolute; } & { background-color: rgb(255, 0, 0, 0.5) !important; } } Thank you for the reply!! I assumed you meant rgba so that's what I added, and this is what it gave me: Any idea how to make it transparent and not gray? Thank you for your help again! Edited January 7, 2022 by WuTangForever Link to comment
tuanphan Posted January 8, 2022 Share Posted January 8, 2022 Try change to background-color: rgb(255, 0, 0, 0.5) !important; Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
WuTangForever Posted January 9, 2022 Author Share Posted January 9, 2022 On 1/7/2022 at 10:00 PM, tuanphan said: Try change to background-color: rgb(255, 0, 0, 0.5) !important; Unfortunately, it just turns it red 😞 Link to comment
tuanphan Posted January 10, 2022 Share Posted January 10, 2022 On 1/9/2022 at 12:04 PM, WuTangForever said: Unfortunately, it just turns it red 😞 So what exactly do you want the left side to show? Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message How to: Setup Password & Share url - Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care Link to comment
WuTangForever Posted January 10, 2022 Author Share Posted January 10, 2022 7 hours ago, tuanphan said: So what exactly do you want the left side to show? On the image I have attached here, the bottom half of that section has a dark opacity on it (marked with the arrows), I would like to mimic that exactly. So, essentially, I really just want to add some opacity to ~30% of the section Link to comment
WuTangForever Posted January 20, 2022 Author Share Posted January 20, 2022 @tuanphan Any ideas for this? I appreciate you Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment