Background Opacity Reservations theme

(Marie Hermo Jensen) #1

I am trying to make the Content Background transparent (hopefully with optional %) with CSS. So far no luck.

(Andrew Tavernor) #2

background-color: transparent!important

You will probably also want to change the scaling of the body background image so that it fills the full height of the browser

background-size: cover

(Andrew Tavernor) #3

also - if you want an opacity colour instead of transparent then just use rgba. The fourth number is the opacity, between 0 and 1 (0% to 100%). So 40% white would be:

(Marie Hermo Jensen) #4

Brilliant. Thanks so much. I used the cover code and opacity code. I also used the opacity code on the footer which also worked a charm. I did however end up with two white lines, could you please have a look?

I am looking forward to learning much more CSS… Please keep in mind that the site is under construction so the content isn’t there yet.

Thank you again

(Stuart Henderson) #5


Hope you don’t mind me popping in on the thread. The CSS @Tav gave there is superb, the site is looking great!
The lines you see appear to me to be theme elements that are now getting in the way due to the opacity. You can turn them off with:-

.shadow {
    display: none;

I’m getting a 404 on the favicon.ico which has this path:

Good luck,

(Marie Hermo Jensen) #6

Thanks Stuart. That worked a charm. And thanks for the heads up. I haven’t uploaded a favicon yet.