媒体查询按钮时出现问题

Question

所以我在我正在设计的网站上实现了一个按钮，一个圆圈内的双角度向上箭头，允许用户快速滚动回到顶部：

现在我有一个媒体查询，它应该缩小比767px更窄的屏幕上的圆圈和箭头。但是，圆圈​​和箭头最终分开：http://imgur.com/gkuaxVm。

圆圈缩小，但箭头移出屏幕？我不明白为什么。

代码（“#toTop”是圆圈）：

    #toTop{
        position: fixed;
        bottom: 10px;
        right: 10px;
        cursor: pointer;
        display: none;
    }
    #toTop .fa {
        margin: 5px;
    }
    @media(max-width:767px) {
    #toTop{
        position: fixed;
        height: 30px;
        width: 30px;
        bottom: 10px;
        right: 10px;
        cursor: pointer;
        display: none;
    }

    #toTop .fa {
        font-size: 0.5em;
    }        
    }

Answer 1

我通过移除圆圈解决了我的问题。