Custom CSS for background and header/top bar [Transparent header]

jimosulli

Hi, I have to different but related problems.

1: I'm trying to use 2 background images - 1 top right and 1 bottom left. I've tried the below in both the custom css in theme options, and in the custom css on an individual page. What am I doing wrong?

{
  background: url(wp-content/uploads/2015/02/topright.png),
                url(wp-content/uploads/2015/02/bottomleft.png);
  background-repeat: no-repeat, no-repeat;
  background-position: top right, bottom right;
}

2. I'm using a stacked header and want to make the header/top bar transparent so that the top right image can wrap the content. I've tried using custom css to implement transparency with rgba color and there's no difference.

Page is: http://www.sashandveil.co.uk/?page_id=548

Thanks for any help!

Albert

Hi,

1. It is not possible to use 2 background images. Only one background image is possible per page.

2. This is very hard to do it and needs a lot of modifications in css. But if you will send us access to your dashboard on pm then we can have a look on it.

EDITED!!! To make transparent header as in this case, you must use below custom css:

#Wrapper, #Content {
    background-color: transparent;
}

#Header_wrapper {
    background-color: transparent !important;
}
#Wrapper {
    box-shadow: 0 0 0 rgba(0, 0, 0, 0);
}
#Top_bar:not(.is-sticky) { 
    background: none !important;
}

Learn more: Video Tutorials | How To | FAQ Vote on what comes next