Since IE (9) doesn't support 'transition' (CSS3) , the submenus of the toolbar are not accessible, because they disappear immediately after you move the cursor away from the first level

  • items like 'store settings' or 'orders' etc.

    That's kinda strange cause in the toolbar_megamenu.css there's a line saying

    /* Fix drop-down cropping in IE 7 & 8 */

    so why would they fix something for IE 7 & 8 which is not working on IE 9 ?
    Or am I missing something?

  • Comments

    scotthooker’s picture

    Any solution to this one?

    dudenhofer’s picture

    The problem is the layering of the dropdowns, this happens on line 105 of commerce_kickstart_menus.css they are given a z-index of -1. If you change this to 1, then the dropdown come down above the menu.

    We will probably need to wrap a span around the text inside the links so we can extend the link down low enough to allow a smooth transition without affecting the look.

    Both the transitions and the IE comment have nothing to do with this issue other than the fact that the transition allows modern browsers to move between the link and the dropdown before it disappears.

    dudenhofer’s picture

    Status: Active » Needs review

    I pushed an update to fix this here:

    This update includes:
    - Adding classes for each depth of the menu (previously using long parent/child css selectors)
    - Adding IE-specific stylesheet
    - Re-working the CSS in both toolbar_megamenu and commerce_kickstart_menus to apply the new classes cleaner styles and IE fixes.

    I had to bring the drop-downs of the menu forward (only in IE) so it was in front of the blue toolbar and flush with the links to allow IE users to select the drop-down options.

    bojanz’s picture

    Status: Needs review » Fixed

    Committed, will be in tomorrow's -dev release.
    Please test, reopen if bugs still remain, and remember to buy dudenhofer a beer :)

    Status: Fixed » Closed (fixed)

    Automatically closed -- issue fixed for 2 weeks with no activity.