Page 1 of 2

transparency

PostPosted: Fri Jan 06, 2012 8:57 pm
by urs
So I fixed the background on my sliding door theme with a custom image and i fixed the image so when you scroll all the other stuff on top moves only. is there a way to make the scrolling "window" part transparent so i can see my background image a little bit?

Re: transparency

PostPosted: Tue Jan 10, 2012 8:12 pm
by haninnka
Hi,
this topic is disscused here http://robertnyman.com/2010/01/11/css-background-transparency-without-affecting-child-elements-through-rgba-and-filters/ and here http://lea.verou.me/rgba.php/ . I used for my website dennisworship.com the rgba option
Code: Select all
background: rgba(0, 0, 0, 0.5)

the first three numbers are for the RGB color and the forth number is for transparency. But not all browsers support that so there should be a fallback option.
Code: Select all
background: #000;
background: rgba(0, 0, 0, 0.5);

good luck :)

Re: transparency

PostPosted: Fri Feb 03, 2012 1:48 pm
by Chevrock
Please help, I am new to working with css. I get the function of the code

background: #000;
background: rgba(0, 0, 0, 0.5);

I simply do not get where to place the code on my style sheet.

Re: transparency

PostPosted: Thu Apr 05, 2012 8:43 pm
by urs
I agree with Chevrock, i can't figure out where to place the code....

Re: transparency

PostPosted: Thu Apr 05, 2012 10:03 pm
by urs
ok guys, with the above information i came up with how to make the background transparent....go to your style.css file and scroll down to the "Structure" section. A few lines below that, you will find a "#wrapper" heading. Under the wrapper heading you will see this:

#wrapper {
margin-top: 20px;
padding: 0 20px;
position: relative;
background: #000;

replace the above with this:

#wrapper {
margin-top: 20px;
padding: 0 20px;
position: relative;
background: #000;
background: rgba(0, 0, 0, 0.7);

You can adjust the 4th value on the last line to change the amount of transparency....I used 0.7 and it looked great. My website is www.upperroomstudios.org.

Re: transparency

PostPosted: Sun Sep 23, 2012 3:09 pm
by Chevrock
replace the above with this:

#wrapper {
margin-top: 20px;
padding: 0 20px;
position: relative;
background: #000;
background: rgba(0, 0, 0, 0.7);


I have not be able to get this to work with 3.0.8. Any suggestions?

Re: transparency

PostPosted: Wed Oct 03, 2012 1:24 pm
by wayne
nice

Re: transparency

PostPosted: Sat Oct 13, 2012 1:48 am
by vladan
Hi,

Would there be something else I'm missing (sorry just a beginner). These codes don't change anything on my page???
Cheers,
Vladan

Re: transparency

PostPosted: Sat Oct 13, 2012 4:03 am
by vladan
Hi,
My text looks like this, doesn't have last 2 lines as per your example???
is that wrong

#wrapper {
margin-top: 20px;
padding: 0 20px;
position: relative;

cheers,
Vladan

Re: transparency

PostPosted: Thu Oct 18, 2012 3:10 pm
by aband
Ok so I have to admit, being an amateur, I didnt create a 'child theme' page. So i made my changes to the site and loved them and then today I updated the new Sliding doors update and bang...the transparancy and the colour I had applied etc has gone.....annoying, but silly of me! So I cut and paste the code on this discussion again, like last time, but this time it doesn't change the white solid background that has appeared, just like others have said, the wrapper code doesnt seem to affect the background colour or transparancy on 3.0.8......HELP! My site is looking under the weather.....