Submenu items not displayed in Internet Explorer and Microsoft Edge

I’m using the Shapely theme with great effort and succes. I developed it in Chrome without any problems. In Chrome and on my mobile phone it gives no problems, but recently i was informed by one of my friends that the website was not working proparly. After a small investigation, i found out that only in any Internet Explorer version and in Microsoft Edge browser the sub-menu items are not displayed in my head menu. This is as far as i know the only problem.

It should work if you hoover over the main menu item, but even pressing the mini traingle next to it, it gives no display of the menu items in it.

I found several topics, searching this website, but regardlesly i still have no solution. Does someone know how to solve this problem?

The url is: https://www.postschutters63.nl
Thanks in advance

Greetings from Peter
the Netherlands

I am building a website using Shapely and had the very same problem. It appears to be a problem with the update 1.2.7. I have rolled the update back to 1.2.6 and it now works fine.

How did you roll back the theme update?

I uploaded the plugin “WP Rollback” (Dashboard, plugins, add new and search for WP Rollback. Then went into themes, hovered curser over the Shapely theme and selected theme details. On the bottom right is the rollback button which enables you to select 1.2.6. Hope this helps.

I have had the same issue, and followed your steps @somersham.
Rolling back to the previous version fixed the issue.
Thanks.

Hey there

Sorry about that, this problem already reported and we are waiting for the fix, please stay on the current version at this moment

I’ll update back to the last version. The rollback did not help me with this problem. Noda, is there any dafe of update foreseen or Scheduled to fix this problem?

hey there

Please add this css and check, it should help:

.main-navigation .menu > li:hover > ul {
opacity: 1;
transform: translate3d(0, 0px, 0);
-webkit-transform: translate3d(0, 0px, 0);
-moz-transform: translate3d(0, 0px, 0);
visibility: visible;
}

if it’s not working please provide access details and i will try to fix it for you

The css worked for me…however it only works to view 1 level of submenu. It doesn’t appear to help the menu open a 2nd level of submenu in Edge or IE. (Website = thoughtsplat.com).

Hey there

Please try this code too:

.main-navigation .menu>li>ul li:hover>a {
opacity: 1;
}

this is the final version of the complete code:

.main-navigation .menu > li:hover > ul {
opacity: 1;
transform: translate3d(0, 0px, 0);
-webkit-transform: translate3d(0, 0px, 0);
-moz-transform: translate3d(0, 0px, 0);
visibility: visible;
}
.main-navigation .menu>li>ul li:hover>a {
opacity: 1;
}

Thanks…the 2nd level submenu still doesn’t appear in IE or Edge (Firefox and Chrome are fine).

Hello richm

Can you please provide link to your site?

Your forum isn’t letting me provide a link right now…but if you scroll up I typed it: thoughtsplat dot com

Good morning

Ok, please try this code now:

.main-navigation .menu > li:hover > ul {
opacity: 1;
transform: translate3d(0, 0px, 0);
-webkit-transform: translate3d(0, 0px, 0);
-moz-transform: translate3d(0, 0px, 0);
visibility: visible;
}
.main-navigation .menu>li>ul li:hover>a {
opacity: 1;
display:block;
}

Still not working on Edge or IE (Firefox & Chrome are fine)

Hello Richm

Please open a new ticket and shend me your access details in private mode, it’s better if I can test it directly