为什么Edge body滚动条与Firefox body滚动条不同?

时间:2015-11-18 06:29:56

标签: html css firefox microsoft-edge

我正在创建一个聊天列表,它在Firefox上运行正常,但它不在Microsoft Edge上。

<div class="chatting">的CSS:

.chatting {
    position: fixed;
    bottom: 5px;
    right: 5px;
    border: 1px solid #f00;
    width: 206px
}

结果 Firefox:

enter image description here

Microsoft Edge:

enter image description here

第二个快照意味着:right: 5px;是不够的。为什么?这是我的问题还是边缘问题?

1 个答案:

答案 0 :(得分:6)

默认情况下,Edge(以及较新的Internet Explorer)使用自动隐藏滚动条,该滚动条不占用布局空间。将-ms-overflow-style: scrollbar添加到CSS会使滚动条的行为类似于Firefox(以及Chrome和其他浏览器)中的滚动条,这应该可以解决问题。

  

<强>滚动条

     

表示元素在内容溢出时显示经典滚动条类型控件。   与-ms-autohiding-scrollbar不同,设置为滚动条的-ms-overflow-style属性的元素上的滚动条始终显示在屏幕上,并且在元素处于非活动状态时不会淡出。   滚动条不会叠加内容,因此会沿元素边缘占据额外的布局空间。

参考:https://msdn.microsoft.com/en-us/library/windows/apps/hh441298.aspx