在FF flex容器中影响子项的宽度和高度

Question

项目是在完整的BEM-STACK技术上完成的，因此不容易显示所有代码。在项目的页脚中，几乎有以下结构：

<div class="footer">
    <div class="footer__inner">
        <div class="footer__content page__col_8 footer__section">      
        </div>
        <div class="footer__feedback page__col_3 footer__section "> 
        </div>
        <div class="footer__social page__col_1 footer__section">
            <a href="" class="link link__control"></a>
            <a href="" class="link link__control"></a>
            <a href="" class="link link__control"></a>
            <a href="" class="link link__control"></a>
       </div>
    </div>
</div>

这里有确切的样式：

.footer {
    height: 180px;

    &__inner {
        width: 1200px;
        margin: 40px auto;
        height: 100px;
        display: flex;
        padding: 0;
    }
}

    &__section {
        box-sizing: border-box;
        padding: 20px;
        border: 2px solid var(--color-border);
        border-right: 0px;
    }
}

 .page {
    &__col {

        &_1 {
            width : 8.3333333333333%;            
        }

        &_2 {
            width : calc(2 / 12 * 100%);            
        }

        &_3 {
            width : calc(3 / 12 * 100%);            
        }

        &_4 {
            width : calc(4 / 12 * 100%);
        }

        &_5 {
            width : calc(5 / 12 * 100%);
        }

        &_7 {
            width : calc(7 / 12 * 100%);
        } 

        &_8 {
            width : calc(8 / 12 * 100%);
        } 
    }
 }

.footer {

    &__social {
        padding: 0px;
        border: 1px solid var(--color-border);
        width: 100px;

        .link {
           box-sizing: border-box;
           display: inline-block;
           width: 49px;
           height: 49px;
           border: 1px solid var(--color-border);
        }
    }
}

在除Firefeox宽度和.link高度之外的所有浏览器中都是49px，边框是1px。在FF中，这些值计算为48.16667px和0.96667px。怎么能修好？应该由ENB构建系统添加前缀