Header background different colours

In addition to above.

So I have manged to figure out the CSS for the different colours having scoured the threads using google search but I still can’t seem to work out how to make the logo area semi transparent. Unfortunately as I want to have the menu above the logo section the transparent header option on the page is disabled. Please can someone help with this as I am losing the will to live!

Thank you. :-)

Hi Ismael,

Thank you and don’t worry it was my own fault for commenting on my own post and confusing things.

So I have applied the code and in principle it has worked, however it seems the semi-transparent section only shows up over the middle of the page despite the colour section image behind being stretched full width on my screen. I seem to remember that when transparent header option is available it is full width, is that right? To be honest it looks a bit weird and not as I would like, is there anyway of making the container full screen width?

Thank you.

p.s. Enfold rocks! It is the greatest theme ever! The support is great too. I don’t think there is anything you guys can’t fix.

Hi Ismael,

Thanks for the additional code but I couldn’t see any difference? Is it just my end? Can you check it too? I have shown below all the custom CSS field just in case anything else in there is conflicting.

.widgettitle { font-size: 20px!important; }

div .copyright {
width: auto!important;
}

.avia-button {
font-size: 25px!important;
}

.av-section-bottom-logo.header_color .container {
background-color: rgba(255,255,255,0.5) !important; }
.av-section-bottom-logo.header_color + div + .avia-section {
margin-top: -135px;

.av-section-bottom-logo.header_color .container, .av-section-bottom-logo.header_color .container .inner-container {
width: 100% !important;
max-width: 100%;
}

@media only screen and (max-width: 767px) {
.responsive .logo a {
display: inline-block;
vertical-align: middle;
}

.responsive .logo {
position: relative;
display: block;
width: 100%;
text-align: center;
}

.logo img { max-height: 48px; }
@media only screen and (max-width: 767px) {
.responsive .logo a, .responsive .logo img {
max-width: 80%;
height: auto !important;
margin-bottom: 15px;
}}

Ahh see I knew it would be something stupid.

You sir, are a genius! Thank you. All working well on that part on desktop but on checking responsive it is still not full width? Any theories?

Plus can I increase the padding above the logo as it looks a bit squashed at the top of the container?

Also, sorry but while I’ve got your attention I’m going to make the most of your knowledge.

On this site, I would like each of the colour sections to fill the screen so that the arrow to jump to next section is always placed at the bottom and it looks/works really sleek. Is this possible as when I selected the “100% of browser height” in the row settings it works fine for the first section but when it jumps to the second it shifts down the page and it looks rubbish. Am I doing something wrong or is there some way of doing this that you can advise?

Thanks
Emma

p.s. can you think of any reason why the following code in quick css would knock out my advanced button styling not to work on desktop version? I have eliminated all other codes by removing and re-applying one-by-one and this is the one that affects it for some reason?

p.p.s Any chance I could get an answer on this one soon? Sorry to pester as I know you are probably snowed under.

@media only screen and (max-width: 767px) {
.responsive .logo a {
display: inline-block;
vertical-align: middle;
}

• This reply was modified 7 years, 11 months ago by efletcher.

Hi Ismael,

Thank you again. The logo code worked fine, so long as I placed it at the top of the quick css field and also applied the !important part.

However the other problem with the colour sections doesn’t seem to have resolved things. I edited the js file as suggested and refreshed and cleared cache etc. but it still has that section that gets cut off. Am I asking too much of the theme do you think?#

As recommended I have also raised a new topic for the button styling. Thanks for the tip.

Thanks
Emma

Sorry please excuse my ignorance but what do you mean by FTP details? Do you want to login in to the wp admin dashboard to you mean?

At present I only have access to the core wp admin files as the hosting is by another person and they installed wordpress on the subdomain we are using for development and granted us admin access.

Hi,

This is what I have been provided as FTP login details for this subdomain.

I hope it works but let me know if you have any problems.

– 01/02/17 – update
Is there any chance you guys could give me an update on your thoughts on this and whether the FTP login details worked okay? Thanks.

• This reply was modified 7 years, 10 months ago by efletcher.