Making text areas and gallery background transparent?

kbrowne1717 · Member · Nov 2, 2013 at 4:26 pm
Copy link

Add topic to favorites
I’m trying to have my page text and image gallery thumbs “float” over the background image, rather than displaying the white box that obscures the background image. I will also have a different background image for each page (I’ve already figured that out), if it matters.
Here is a page that I’ve added a background image to.

Daily Confidential

Again, how can I get rid of the white boxes around the text and image gallery?
I’m using a customized Expound theme.

The blog I need help with is: (visible only to logged in users)
thesacredpath · Member · Nov 4, 2013 at 6:21 pm
Copy link
Hi there, the following will make that white background for the header and content area semi-transparent. The last number, 0.75 is the opacity. 1 would be completely opaque and the smaller the number, the more transparent it would be.
```
#page {
    background: rgba(255, 255, 255, 0.75);
}
```
If you wish, or if it makes more sense, you can target individual pages as you did with the background image by making the selector page specific such as this.
```
.page-id-27 #page {
    background: rgba(255, 255, 255, 0.75);
}
```
towingsolutions · Member · Nov 6, 2013 at 5:27 pm
Copy link
how do i make my content background black and then transparent
thesacredpath · Member · Nov 8, 2013 at 3:54 am
Copy link
Hi, since you are using a different theme than the one discussed in this thread, can I ask that you start a new thread to prevent confusion for those that may come upon this in the future. Many thanks in advance.

In the Forever theme, you already have this in your custom CSS with a grey color, so change it so it looks like this and then you can adjust the 0.7 value on the end to suit your desire. You will need to change text colors of course so they will show up.
```
#page, ul.menu li.current_page_item a, ul.menu li.current_page_item a:hover {
    background: rgba(0, 0, 0, 0.7);
}
```
towingsolutions · Member · Nov 8, 2013 at 7:30 am
Copy link
Hi Sir thank you for helping me on that. but can you tell me now how to make my menu font white, its black and cant be seen
thesacredpath · Member · Nov 8, 2013 at 3:50 pm
Copy link
You are welcome, and to change the menu text color, add these. The first is the non-hover color and the second is the hover color (I’ve used obnoxious colors in my example).
```
#access a {
color: #cc33cc;
}

#page #access li:hover > a {
color: #33cc33;
}
```

No items found.