Title: Transparency Issue Last modified: March 13, 2017 --- # Transparency Issue * [scottball](https://wordpress.org/support/users/scottball/) * (@scottball) * [9 years, 3 months ago](https://wordpress.org/support/topic/transparency-issue-3/) * [http://scottairforceball.com/](http://scottairforceball.com/) is the website I am trying to make the opacity change on. notice the grey content box. I cannot get it to be transparent without making the whole thing transparent (using CSS on the body) Viewing 12 replies - 1 through 12 (of 12 total) * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 3 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8909262) * …so what have you tried? You need to be specific if you want help with this, without someone logging in and looking at your files. * It appears the section that is gray is controlled by 3 classes; .content ; .home; and .blog . you will need to edit one those in your CSS. You’ll probably have to try each one, or combination of them until you find which one gets it. (with a child theme of course) I’m thinking maybe .blog class may do it…but I could be wrong. * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 3 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8909341) * I found it…it’s on the theme’s style.css stylesheet, and the class is: * ``` .home .format-gallery, .page-template-blog-page-php .format-gallery { background: #666; } ``` * that is where you want to change the background… - This reply was modified 9 years, 2 months ago by [bdbrown](https://wordpress.org/support/users/bdbrown/). * [Romik84](https://wordpress.org/support/users/romik84/) * (@romik84) * [9 years, 3 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8915086) * Hi, * Please put this custom css in your custom css section of theme options * ``` #wrapper { background: none; } .content { background-color: transparent; background: #5555554D; } ``` * Thank you * Thread Starter [scottball](https://wordpress.org/support/users/scottball/) * (@scottball) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8921699) * [@donna](https://wordpress.org/support/users/donna/): I edited the .page-template- blog-page-php .format-gallery to include `background-color: transparent;` but it did not work. * [@romik84](https://wordpress.org/support/users/romik84/): I added that to the end of the custom css section and it resulted in a white page. Is there a specific place this code needs to go? is there another #wrapper I need to edit? * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8922769) * If you put it in the right place, it should have. The class should already exist because I got that off your active page. you shouldn’t have to add it. Stylesheets“ cascade” …so if it’s not in the right place, something else could override it. You can try using !important also… * and “transparent” or “none” haven’t always been valid CSS, they are new, so an older browser could throw an error. Does that change the color if you put an actual color there? I don’t see a gray box anymore, so maybe you got it already?… anyways, here’s some additional CSS code to use or not use… It’s hard to tell without access to the actual files to play around with. Romik’s post should work, except the color has too many numbers in it, and it’s not a color. Change that, or remove it, and the rest should be good, if you put it in the correct class/ id on the stylesheet. Here’s some more CSS to play around with… * ``` display:inline-block; /*you really shouldn’t have to change this though, since the area you want transparent is already correct, right? */ .page-template-blog-page-php .format-gallery { zoom: 1; filter: alpha(opacity=50); opacity: 0.5; } /* This is for old stuff (replace classes and values with your own) : */ .page-template-blog-page-php .format-gallery { /* Required for IE 5, 6, 7 */ /* …or something to trigger hasLayout, like zoom: 1; */ width: 100%; /* Theoretically for IE 8 & 9 (more valid) */ /* …but not required as filter works too */ /* should come BEFORE filter */ -ms-filter:”progid:DXImageTransform.Microsoft.Alpha(Opacity=50)”; /* or (Opacity=0) */ /* This works in IE 8 & 9 too */ /* … but also 5, 6, 7 */ filter: alpha(opacity=50); /* Older than Firefox 0.9 */ -moz-opacity:0.5; /* Safari 1.x (pre WebKit!) */ -khtml-opacity: 0.5; /* Modern! /* Firefox 0.9+, Safari 2?, Chrome any? /* Opera 9+, IE 9+ */ opacity: 0.5; } ``` * _[Moderator note: code fixed. Please wrap code in the backtick character or [use the code button](https://codex.wordpress.org/Forum_Welcome#Posting_Code).]_ - This reply was modified 9 years, 2 months ago by [bdbrown](https://wordpress.org/support/users/bdbrown/). * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8922782) * P.S. …I’m an Air Force Veteran, so I like your site as well…nice. 🙂 * [Romik84](https://wordpress.org/support/users/romik84/) * (@romik84) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8924557) * Hi, * You try to !important rule in css, Especially in #wrapper css. * Thank you * Thread Starter [scottball](https://wordpress.org/support/users/scottball/) * (@scottball) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8927131) * [@donnawpadmin](https://wordpress.org/support/users/donnawpadmin/) & [@romik84](https://wordpress.org/support/users/romik84/): Thank you for the kind words, I’m not an expert in HTML so that’s why I’m struggling. I tried your suggestion, nothing changes. I also tried Romik’s suggestion and it doesn’t work either. * I was able to find the piece of code that allowed me to change it from grey to black. but when I did the line to make the wrapper transparent, it didn’t make a difference. I also tried the !important rule. * I noticed that when I do a lower opacity(or transparent), it makes the entire container, including the menu, bootstrap slider and the images opaque as well. I want to just have the black container be opaque, not the whole thing. * Thanks for your help. * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8927160) * The code is right, it’s just a matter of finding/locating the correct class/id that it belongs in. Wrapper is too far out on the div tree…it would be much easier if I can see the code. Can you email me a copy of the style.css and the child theme stylesheet if you have one. I can’t look at it today, but maybe on the weekend…after late Saturday. * You can try the classes individually…for example, try * ``` .format-gallery { background: #666; } ``` * if not that one, try the others in the fix I gave you, by themselves. (each part preceeded by a “.” is a class, everything preceeded with a “#” is an ID ) So the fix I gave you is 3 classes…try each one individually. - This reply was modified 9 years, 2 months ago by [bdbrown](https://wordpress.org/support/users/bdbrown/). * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8927603) * Also, if you are not already doing it, you should learn about child themes and how they work, and how to create them. Because otherwise, when you update, any changes you make to the theme’s stylesheet will lost, and you will have to go through and do them all over again. Themes are never exactly how we want them to look, we all make changes, whether it’s color, layout, fonts, or what have you. The best way to make these changes is to create a child theme. That way, you only make them once. The “parent theme” can be updated, and it won’t affect the site. (usually) There are many places to get help on learning how to create and use child themes. But here is WordPress’ codex files: [https://codex.wordpress.org/Child_Themes](https://codex.wordpress.org/Child_Themes) * Thread Starter [scottball](https://wordpress.org/support/users/scottball/) * (@scottball) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8948757) * [@donnawpadmin](https://wordpress.org/support/users/donnawpadmin/) is there a way i can email it to you? - This reply was modified 9 years, 2 months ago by [scottball](https://wordpress.org/support/users/scottball/). * [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * (@donnawpadmin) * [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8949270) * I don’t see a way to message people on this forum. Go to my website [https://everythingit.us](https://everythingit.us), and go to the contact page, and send me your email, and I’ll get in touch with you that way, and I’ll help you. but I don’t see the gray box anymore. I thought you had solved this already…But yes, I’ll help you out. Viewing 12 replies - 1 through 12 (of 12 total) The topic ‘Transparency Issue’ is closed to new replies. * ![](https://i0.wp.com/themes.svn.wordpress.org/evolve/4.3.7/screenshot.png) * evolve * [Support Threads](https://wordpress.org/support/theme/evolve/) * [Active Topics](https://wordpress.org/support/theme/evolve/active/) * [Unresolved Topics](https://wordpress.org/support/theme/evolve/unresolved/) * [Reviews](https://wordpress.org/support/theme/evolve/reviews/) * 12 replies * 3 participants * Last reply from: [donnaWPadmin](https://wordpress.org/support/users/donnawpadmin/) * Last activity: [9 years, 2 months ago](https://wordpress.org/support/topic/transparency-issue-3/#post-8949270) * Status: not resolved