    .#{$prefix}menu {
        outline: none;
    }

    .#{$prefix}menu-item {
        white-space: nowrap;
        overflow: hidden;
    }

    // "Foreign" Components (such as form fields) put inside a Menu get this class.
    .#{$prefix}menu-item-cmp {

        // Ensure labels are centered when in menus which enlarge the height of a Labelable Component
        .#{$prefix}field-label-cell {
            vertical-align: middle;
        }
        @if not is-null($menu-component-margin) and $menu-component-margin != 0 {
            margin: $menu-component-margin;
        }
    }

    .#{$prefix}menu-icon-separator {
        position: absolute;
        top: 0px;
        z-index: 0;
        height: 100%;
        overflow: hidden;
        .#{$prefix}menu-plain & {
            display: none;
        }
    }

    .#{$prefix}menu-item-link {
        text-decoration: none;
        outline: 0;
        // display:block is required to make the menu item stretch to fill its container so that
        // when using href, the entire menu item is clickable.
        // If we ever consider going back to inline or inline-block, please remember inline
        // will not work because it allows multi line menu items wrap into the padding area
        // (icon space) in Webkit
        display: block;

    }

    .#{$prefix}menu-item-text {
        display: inline-block;
        @if $include-ie {
            zoom: 1;
        }
    }

    .#{$prefix}menu-item-icon,
    .#{$prefix}menu-item-icon-right,
    .#{$prefix}menu-item-arrow {
        font-size: 0;
        position: absolute;
        text-align: center;
    }