1

This is the site, if we drag it through the chrome or ff its menu works fine in all the resolutions, but if we open this on any mobile, we cannot click on top menu bar, why is that ? and how to solve this problem.

2

In file /templates/lvwineries/css/style.css on line 248 in selector #bottom2 add attribute z-index: -1; like this:

#bottom2 {
min-height: 400px;
position: relative;
z-index: -1;
}

on line 1200 in selector #header_right add attribute z-index:1; like this:

#header_right {
height: 99px;
z-index:1;
}

on line 1204 in selector .menu_principal add attribute z-index:2: like this:

.menu_principal {
width: 481px;
z-index: 2;
}

That should make menu links clickable.

2
  • 2
    Thanks a lot, it worked, but can you explain what was wrong with it and what we did in order to fix it, i am new to front end. Mar 4 '16 at 20:57
  • 2
    You're welcome. Overlapping and wrong-sized divs #bottom2 and #header_right have caused it. This template looks to me as desktop-only type, and just lightly re-worked recently to fit mobile devices. If this was mobile-first type, it would have bootstrap.css, hamburger menu or off-canvas menu, etc...
    – Mikan
    Mar 4 '16 at 21:12

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.