如何适合fa-3x（字体 - 令人敬畏）图标后面的白色背景

Question

我发现很难自定义我创建的字体 - 真棒图标背后的背景。我试图制作一个白色背景来扩展实际图标。

现在它看起来像图像：

在这里你可以看到白色背景在图标周围占据了太多空间。

代码

 <div class="footer-icons">
                    <a href="#"><i class="fa fa-pencil-square fa-3x pen-btn"></i></a>
                </div>

的CSS

 .footer-icons a {
    padding-right: 10px; 
    color: green; 
 }

 .footer-icons i {
    background-color: white;   
    border-radius: 5px;
    padding-left: 3px;
    padding-right: 3px;
 }

尝试使用填充左侧和右侧使用负值使其变小（保持在绿色图标内）

如果我删除填充，它看起来像这样：

希望有人能看出我做错了什么。