Question

I’m building this site, as you can see I moved the nav menu to the left. If you hover the mouse on any item “Home” / “L’istituto” / “Infanzia/Primaria” (etc) the child items are shown to the right. Everything’s ok except that the position:relative; left:130px on .main-navigation li ul li a make the underneath items non-clickable (because there is the block there, moved to the right because of the left:130px. How can I have the underneath items still clickable? Thanks in advance.

P.S.: If I try with a z-index: 999999 on .main-navigation li a, .main-navigation li I can’t reach the child items anymore (except the first one).

Answer 1

I set this and worked 🙂

.main-navigation li ul {
margin: 0 0 0 200px;
position: absolute;
}