[Glen Pavelich]

1) the drop down menu items hide behind the slider.
See – http://www.everydayfarms.ca/saskcherries/ (recipes tab for instance)

(style line 3272) This css has
#header-featured-image .wrapper, #feature-slider .wrapper {
position: relative;
}
If I turn off relative
ie
#header-featured-image .wrapper, #feature-slider .wrapper {
position: inherit;
}
then it works for the

pages but not the home page

. How do I correct this permanently for pages and home? I do have a child theme and custom css.

2) Also – the responsive menu doesn’t work either unless as above I change the position to inherit. BUT AGAIN this only works for the pages, and not the home page.

[Mahesh]

@fireflywebs: Add the following CSS:

#masthead .wrapper {
    opacity: unset;
}

Its because of the following CSS:

#masthead .wrapper {
    opacity: 0.9;
}

[Glen Pavelich]

Yes, that did fix the issue with the menu items not showing, but I don’t understand how opacity of the masthead wrapper would do that.

Is there now a way to make set opacity to that element??

It’s also curious why it was only affecting the home page and not the other pages after I set the position to inherit.
Is this a glitch with the theme? Can it be corrected?

Thanks

[Mahesh]

@fireflywebs: Please use the following CSS for opacity:

#masthead .wrapper {
    background-color: rgba(55, 71, 65, 0.9);
}

Yes, its kinda strange that changing opacity property is causing such issue.

Regards,
Mahesh

[Glen Pavelich]

I thought I had the issue fixed but then glitches continued when I changed opacity for the footer container, site info, etc.
I changed it back to fix some issues, but now the device menu doesn’t work at all from the home page, and without adding via Css (by the way) there is no background color on device dropdown for the other pages. I added a media query for that.

I did also take out the header for the other pages as well. But now something is up.

I’m only using normal css changes – but the menu keeps being affected.

Adding this
#supplementary .wrapper {
background-color: #374741;
opacity: 0.9;
}
took out the functionality for the top menu for devices

Anyway something else is now interfering with the device menu. The drop down works for the second pages. It hides for the home page.

[Glen Pavelich]

Re – the above addition issue…. I have upgraded to 1.3.3. but this issue remains

[Mahesh]

@fireflywebs: Yes, its kinda strange issue, using opacity is creating a problem. We are working on it and as soon as its fixed, we’ll let you know. For not, please use rgba() for opacity effect. Thank you for your patience.

Regards,
Mahesh

[Sakin]

The main problem I see in your site in the child theme style.css which is conflicting with our main css. For example, the following css in your child theme style.css should be removed.

#masthead .wrapper {
    height: 150px;
}

[Sakin]

But if you are trying to manage the height of your header without the spaces, then you can use CSS hack and replace that css with the following css:

#masthead .wrapper {
    height: 1%;
    overflow: hidden;
}

[Author]

Posts