与圆的背景颜色的泡影信件

Question

我记不起我的登录信息了。我有一个简单的跨度，创建一个特定颜色的泡沫字母，我的意思是它制作一个圆形的子弹，字母切出。现在大多数字母我只能通过白色的背景颜色显示，但其中一个我需要bg为黑色。这就是我的代码。

<span class="arr">R</span>

.arr {
font-family: "Bullet";
color: #ffda00;
background-color: black;
border-radius: 50%;
}

现在除了气泡两侧的黑色峰值外，它显示得很好。我尝试过背景大小，宽度，负边框宽度，浏览器似乎忽略了填充。我也尝试过display：block; float：left;并显示：inline-block;

有人有任何建议吗？

我有点修理它但仍在寻找更好的方法。我用泡泡字母嵌套了一个div并应用了背景颜色。但我仍然需要一种方法让它自动缩放到字母。

<span class="arr"><div class="bgb"></div>R</span>

和css

.arr {
font-family: "Bullet";
color: rgb(232, 206, 53);
position: relative;
margin-left: -1px;
}

.bgb {
width: 41px;
height: 41px;
display: inline-block;
background-color: black;
z-index: -1;
position: absolute;
margin: 7px;
border-radius: 50%;
}