CODEWITHSUNDEEP
htmlcsswordpress
Dano007
Dano007

Reputation: 1932

Menu obstruction by a invisible element

https://bethparmar.co.uk/

The impact of this is from the homepage only, other pages work as expected.

This is a WordPress site, and the home page has code created using the old school editor method rather than a page builder.

Its a strange one as the I have concluded that the ' My Programmes' section is actually blocking the ability to click on the menu items, for example, 'Workshops'.

If you double click on the Workshop menu item, a sub menu opens, but the actual links appear blocked by the div#pg-11-0 { section.

I feel like I need to add some form of invisible space in between the elements - but by doing so it changes the page layout.

Via CSS I thought that I maybe able to force the menu element to be 'ontop' so not being blocked by another layer...

I tried doing this by changing the menu position: absolute; but failed.

Any help please?

Upvotes: 0

Views: 170

Answers (2)

gikall
gikall

Reputation: 607

I see that you give position: absolute in your #site-header .navbar.navbar > .navbar-collapse > .navbar-nav > li > ul

So give z-index in your css.

 #site-header .navbar.navbar > .navbar-collapse > .navbar-nav > li > ul {
    z-index: 9
}

Upvotes: 1

Dezefy
Dezefy

Reputation: 2096

#site-header {
    z-index: 10;
    position: relative;
}

Adding this css code to your theme's css file should fix your problem.

Upvotes: 1

Related Questions