Firefox的绝对位置与Chrome不同

Question

我最近遇到了一些代码错误。基本上，绝对位置属性在Chrome上可以正常工作，但在Firefox上会产生不同的结果。有什么想法吗？

交涉：

铬：

火狐： 注意：在firefox表示中，第二个小方框存在但被截断。

代码：

HTML：

a = "www.example.com/hi/test/home.html";
b = a.substr(0, a.lastIndexOf('/'));

// b = www.example.com/hi/test

SCSS：

<div id="card-info">
        </div>
        <div class="arrow-wrapper">
            <i class=" visible-lg arrow-left pull-left fa fa-arrow-circle-o-left fa-4x" aria-hidden="true"></i>
            <i class="visible-lg arrow-right pull-right fa fa-arrow-circle-o-right fa-4x" aria-hidden="true"></i>
        </div>

Answer 1

将此CSS添加到absolute元素，因为当您使用position:absolute;

时，Firefox需要一个明确的位置

left: 0;
right: 0;
top: 50%;