在IE 9(IE 8)中是否有针对Flexbox的纯CSS解决方案?

时间:2016-05-24 10:06:44

标签: css css3 flexbox modernizr

我一直在使用Flexbox自动对齐一个效果很好的菜单,我非常喜欢这个CSS功能。但是,菜单显然在IE8中不起作用,实际上在IE 9中消失了。

是否有任何纯CSS解决方案,而不是使用Javascript,也许还有我见过的名为Modernizer的东西?

                #cssmenu ul {
                -webkit-box-orient: horizontal;
                -webkit-box-direction: normal;
                -webkit-flex-direction: row;
                -ms-flex-direction: row;
                flex-direction: row;
                -webkit-justify-content: space-around;
                -ms-flex-pack: distribute;
                justify-content: space-around;
                display: -webkit-box;
                display: -webkit-flex;
                display: -ms-flexbox;
                display: flex;
                -webkit-flex-wrap: wrap;
                -ms-flex-wrap: wrap;
                flex-wrap: wrap;
                }
                /* Default CSS from Shop stylesheet */
                #cssmenu,
                #cssmenu ul,
                #cssmenu ul li,
                #cssmenu ul li a,
                #cssmenu #menu-button {
                margin: 0;
                padding: 0;
                border: 0;
                list-style: none;
                line-height: 1;
                display: block;
                position: relative;
                -webkit-box-sizing: border-box;
                -moz-box-sizing: border-box;
                box-sizing: border-box;
                }

        
            <div id="cssmenu">
            <ul>
            <li><a href="/menu1">Menu 1</a>
            </li>
            <li><a href="/menu2">Menu 2</a>
            </li>
            <li><a href="/menu3">Menu 3</a>
            </li>
            <li><a href="/menu4">Menu 4</a>
            </li>
            <li><a href="/menu5">Menu 5</a>
            </li>
            <li><a href="/menu6">Menu 6</a>
            </li>
            </ul>
            </div>

        

0 个答案:

没有答案