Archived topic
Opacity of container control
14 replies · Started by Mark on September 11, 2014
Can I change my container background opacity so that I may better see my background image.
Same question for sidebar widgets
You can create a 2 x 2px PNG image with 70% opacity and upload it as your content background image, then remove the content background color.
That should achieve what you're looking for :)
I created the image 2x2px with a 70% opacity and uploaded it as background image.
Background images content, don't see remove the content background color
Never mind located it, became available after I kept looking.
Still upon removing container background is white
Hi Mark,
This is the image you want to upload as your content background image: https://www.generatepress.com/wp-content/uploads/2014/09/trans.png
It's just a tiny semi-transparent image that will repeat and give you the look you're looking for.
Save it to your computer then upload :)
I followed the same procedure adding the 2x2px transparent image.
No luck
Next just to be sure I was doing it right I went through and added regular sized test images into my container image and header, sidebars, footer image and that worked.
see here http://drfixup.com/
these are .png with different opacity
Still cant see through to the background image.
Hi Mark,
Sorry I didn't get back to you sooner - seems this one slipped away.
I took a look and it seems you've changed the site a bit.
Let me know.
Going to mark this resolved. Reply in here to re-open if you need to.
I'm trying to control the opacity of my container so that I can see through
to the background.
tried a 2x2px transparent and it didn't do it.
So I made transparent a bigger pic and put it in there and that didn't do it.
There seems to be a layer between the container and the background.
Are you removing the content color as well? Go to "Colors > Content" and remove anything set in the Content Color section.
If you have no content background color set, and you've set the background image on the content, you'll be able to see through to the site background.
That was it!
There was a #FFFFFF
in the color and I removed it.
Now can see through the content to the background.
Resolved
I followed these steps with some success but there still seems to be another layer inside the body layer. Both are transparent but one is slightly less than the other.
http://www.ecoglam.trustsites.org
Thanks for any help you can give.
Ha - you found a bug! When you have "One Container" selected, the background is applied twice.
I've implemented the fix for the next version.
For now, you can add this CSS:
.inside-article {
background-image: none;
}
Thanks!
Check this one.....CSS Brackground Opacity
Mitch
Unfortunately, using the opacity attribute on elements also reduces the opacity of the text and any content inside the container, so it's not ideal for any content containers.