Drop Down Menu Problem

Hello,

I have Illdy on our dragon boat club web site, Seattle SAKE Paddling Club – Promoting the physical, mental, and emotional benefits of paddle sports in the Seattle community.. There is a problem with the drop down menus that I can’t figure out.

When you floatover the various headings, the first topic in the drop-down is against the header image background, while all other topics in the drop-down menu have white backgrounds. The white background doesn’t show up until you mouse down into the drop-down. This is a problem because it makes the first topic in the drop down invisible against many of the rotating photos in the header. Could you please tell me how to fix that?

Thanks,

Lisa Harkins

Hello there,

I hope you are doing well today.

I am trying to troubleshoot this issue but could you please tell me if you made any changes to the code of the header menu?

Best Regards,
Support

Thank you!

I do have a change for the header, for the color of the text and its position.

#header .top-header .header-navigation ul li a {
color: #cc0000;
position: relative;
top: -50px;

}

Hi,

That solves your question?

Let us know if you have any other questions,

Thanks,
laranz.

No, I was asked if I had made any modifications to the header, and I have. That is the modification.

I assume they were trying to figure out if adjusted code was causing the problem? I am still having the problem.

It’s odd, because it’s like the white background box is just moved down a bit. So the top link doesn’t show up real well and there is lots of dead space at the bottom until you get your mouse down in there.

So I have been thinking about this, and I guess what has happened is that when I moved the header up to keep it from obstructing my banner photo so much, I should have also moved the drop down up. I know just enough code to be dangerous, and I am not sure what I should do to fix that.

Lisa

Hello there,

At this point we can move the element to be more inline with the menu container. You can use the following CSS code to do so by going to Appearance > Customize > Additional CSS and pasting it there.


/*Change sub menu position*/
#header .top-header .header-navigation ul li a {
    top: -19px;
}

Best Regards,
Support

Worked perfectly! Thanks!!

Hello there,

I am glad the solution worked for you.
Please feel free to contact us again in the future regarding any other issues.

Best Regards,
Support