Firefox 的 hack 及问题

hack:

@-moz-document url-prefix(){

        #selector{

            display: flex;

            justify-content: space-between;

        }

}

问题一：行内元素 a 浮动后，导致位置错乱，暂定原因为父级或本身公用样式设置了 white-space: nowrap;

html:

<nobr>

   <span>通知</span><span id="sel"></span>

</nobr>

<nobr class="nobr">

   <a href="message.aspx" class="moreMsg">更多</a>

</nobr>

css:

.moreMsg{

    /*float:right;*/

    padding-right: 10px;

    padding-top: 5px;

    text-decoration: underline;

    font-size: 13px !important;

    color: #0072c6 !important;    

}

.nobr{

    float:right;

}

.ms-titleText.ms-titleText, .ms-titleText > a{

    white-space:normal !important;

}

在 IE7、8、9、10、Edge 及 chrome 下，仅使用 .moreMsg （float:right; 没有注释的情况下）即可有以下效果：

而在火狐下，必须去掉加上

.nobr，

.ms-titleText.ms-titleText, .ms-titleText > a

以上2个类才行，否则会是如下效果：

巴特西

Firefox 的 hack 及问题

最新文章

热门文章

巴特西

Firefox 的 hack 及 问题

最新文章

热门文章

Firefox 的 hack 及问题