Question

我有一个嵌套的导航，在除IE 11之外的所有其他浏览器中都可以正常工作。 HTML如下：

<nav id="nav">
        <div class="left">
            <div class="holder">
                <ul class="leftside-menu">
                    <li class="show-menu"><a href="">Benefits</a>
                        <ul class="leftside-nested-menu">
                            <li><a href="Design.aspx">Design</a></li>
                            <li><a href="Performance.aspx">Performance</a></li>
                            <li><a href="Installation.aspx">Installation</a></li>
                        </ul>
                    </li>
                    <li class="hideIt"><a href="Design.aspx">Design</a></li>
                    <li class="hideIt"><a href="Performance.aspx">Performance</a></li>
                    <li class="hideIt"><a href="Installation.aspx">Installation</a></li>
                    <li><a style="z-index: 10;" href="Testing.aspx">Testing</a></li>
                    <li><a class="getWidth" href="Resources.aspx">Resources</a></li>
                    <li><a href="map">Map</a>
                </ul>
            </div>
        </div>
</nav>

这是显示器的CSS：

            .leftside-menu {
                display: inline;
                padding: 0;
            }

                .leftside-menu li {
                    display: inline;
                    list-style-type: none;
                    position: relative;
                }

            .leftside-nested-menu {
                position: absolute;
                display: none;
                z-index: -1;
            }

                .leftside-nested-menu li:nth-child(n+2) a {
                    margin: 0;
                }

            .show-menu:hover > a {
                color: #b99a3a;
            }

            .show-menu:hover .leftside-nested-menu {
                display: inline-block;
                top: 40px;
            }

            nav.sticky .leftside-nested-menu {
                background-color: rgba(255, 255, 255, 0.95);
                padding: 0 25px 15px;
            }

            .leftside-menu li.hideIt {
                display: none;
            }

            @media only screen and (max-width: 1028px) {
                .leftside-menu li.hideIt {
                    display: block;
                }

                .leftside-menu li.show-menu, .leftside-menu li.show-menu a {
                    display: none;
                }
            }

我不确定还有其他选择。我已经尝试过在IE开发人员工具中使用display：inline，它可以用于垂直显示，但是将其推向了侧面。它不尊重相对亲代中的绝对定位。还有其他想法可以使这项工作吗？提前致谢。 CODEPEN：https://codepen.io/sazad/pen/YOeQPp

如果我将其更改为.show-menu：hover .left-nested-menu菜单显示改为行内阻止，这就是我的IE 11中显示的内容：

IE 11错误：嵌套导航不会以块格式显示

0 个答案: