2

firefox用に指定された次のCSSがあります。

.bill-tab-button {
    width: 33.3%;
    height: 100%;
    float: left;
    border-left: 1px solid rgb(197, 196, 196);
    border-bottom: 1px solid rgb(197, 196, 196);
    box-sizing: border-box;
    font-family: MyriadProReg;
    cursor: pointer;
}

.bill-tab-fixed-width {
    width: 105px;
}

.bill-tab-button-selected {
    border-bottom: 2px solid red;
    box-sizing: border-box;
    color: #b83709;
    border-left: none;
}

.bill-tab-button span {
    padding: 3px;
    vertical-align: -3px;
}

/* Firefox Specific CSS Styling */

@-moz-document url-prefix (){
    .bill-tab-button { 
        width:33.2%;
        height: 90%;
        float: left;
        border-left: 1px solid rgb(197, 196, 196);
        border-bottom: 1px solid rgb(197, 196, 196);
        box-sizing: border-box;
        font-family: MyriadProReg;
    }

    .bill-tab-fixed-width {
        width: 104.0px;!important
    }

    .bill-tab-button-selected {
        border-bottom: 2px solid red;
        box-sizing: border-box;
        color: #b83709;
        border-left: none;
    }
}

サーバー ( jetty ) なしでこれらをテストすると、CSS は完全にレンダリングされます! この CSS を春の Web アプリに使用しており、jetty をサーバーとして使用しています。アプリケーションを実行すると、ブラウザーは Firefox 固有の CSS ではなくデフォルトの CSS をレンダリングします。

URL プレフィックスと競合するものはありますか。私を助けてください!

4

1 に答える 1