Our theme's menu structure was designed to allow for dropdowns, but a former programmer turned it off. We are having a hard time finding where this occurred.


An odd thing happens when you use the device inspector in Chrome, as the picture below shows that just before it kicks to the mobile menu, the dropdown suddenly appears. Between 980px wide and 1200px wide in the device inspector the menu gets bonkers. Its all busted still, but the dropdown suddenly appears there at a certain screen size...

enter image description here

Edit: I think I've found the source:

enter image description here

So clearly the list element is set to not display...but sadly this isn't in the CSS:

enter image description here

As element.style has no css location, its hardcoded into the source. I just don't know what file?

Can anyone advise?

EDIT CSS the menu is using doesn't indicate its causing this.

    @media only screen and (min-width: 980px) and (max-width: 1199px) {
      .sf-menu {margin: 0 -20px;}
    @media only screen and (min-width: 979px) {
        .sf-menu-phone {  display: none !important;}

    @media only screen and (max-width: 979px) {
      .sf-menu-phone {display: none;}
      /* menu icon */
      #menu-icon {
        display: block;
        background: url("../images/nav-bg.jpg") repeat-x scroll 0 0 transparent;
        font-size: 18px;
        font-weight: bold;
        line-height: 21px;
        color: #fff;
        cursor: pointer;
        text-transform: uppercase;
        padding: 20px 0 0 20px;
        height: 47px;
        position: relative;
        z-index: 2;
  • looks to me like some javascript keeps turning the elements off. try searching your code for sfHover, this class seems to trigger the display none
    – Robin
    Aug 19, 2016 at 14:44
  • I can't see anything with that class saying to display none. When inspecting, the display:none isn't attributed to a css file, which means its hard coded. I need to find the file that's been hard coded. The SF menu css isn't showing anything amiss... added above.
    – Qozmiq
    Aug 19, 2016 at 14:51
  • if it's hardcoded just download the source and search your code :P but I think it's being added with js because the display changes on hover briefly
    – Robin
    Aug 19, 2016 at 14:53
  • Yes exactly I just don't know what source file is holding this. topmenu.phtml has nothing.
    – Qozmiq
    Aug 19, 2016 at 15:00


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Browse other questions tagged or ask your own question.