Menubar is showing up in mobile format instead of desktop format

• 

  collinchang · Member · Nov 10, 2017 at 6:03 am

  • Copy link
  • Add topic to favorites

  I have an intranet website and unable to share out. Below is my description and this problem happens on IE 11. Chrome and Safari is fine.

  In Chrome and Safari, using Dara theme, I can see the expected 4 items lined up in the horizontal navigation bar with white lines separating each sub-menu items. But when I launched IE, the first thing I see is mobile menu and I do not see the white line separator. The hover effect which highlights the selection in grey is not shown too.

  If there is an email that I can send the screenshot, please let me know. I am looking forward to hear from you on possible CSS change.

• 

  collinchang · Member · Nov 10, 2017 at 6:07 am

  • Copy link

  Continuing…
  The strange thing is that if I were to continue to use IE11 and login with wp-admin, goto customise, the website is showing the menu bar items layout as what shown in Chrome and Safari and not in the mobile layout.

  Issue only happens if I launch IE11 by itself without going into the wp-admin mode

• 

  thesacredpath · Member · Nov 10, 2017 at 7:06 pm

  • Copy link

  Hi there, without being able to see the issue on the site, it is a little hard to diagnose. I checked the Dara demo site with Browserstack (I’m on Mac so don’t have IE11) and don’t see the issue you describe.

  You mention intranet, it is on company servers?

• 

  collinchang · Member · Nov 13, 2017 at 2:57 am

  • Copy link

  Yes. intranet is on company server. Chrome and Safari no issue. Only on IE 11. Beside showing the menu mobile, in a desktop view, the menu mobile has additional bullets to the right of each submenu items and missing separator lines between each of the sub menu items.

  If there is a way for me to send you the screenshot, let me know. At the moment, the intranet is protected from external access who are not employee.

• 

  thesacredpath · Member · Nov 13, 2017 at 8:52 pm

  • Copy link

  This is really difficult to diagnose without being able to look at the site directly, but first off, if you have done any customizations via CSS or changes to the PHP files, I would suggest removing those and see if the issue goes away.

  The Dara theme switches, in its unmodified state, to the touch device menu at screen/window widths of 768px and narrower. Make sure that you have your browser wider that that.

  If you have done CSS customizations, could you copy those out and put them here between code tags, like this?

  <code>
  all the CSS here
  </code>

  I can then test that in my test site and see what is going on.