我正在创建一个聊天列表,它在Firefox上运行正常,但它不在Microsoft Edge上。
根<div class="chatting">
的CSS:
.chatting {
position: fixed;
bottom: 5px;
right: 5px;
border: 1px solid #f00;
width: 206px
}
结果 Firefox:
和 Microsoft Edge:
第二个快照意味着:right: 5px;
是不够的。为什么?这是我的问题还是边缘问题?
答案 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