Html 需要帮助设置图标的样式吗

我正在尝试设置图标的样式，我遇到了一点小麻烦，因为图标的样式将边框顶部和边框底部属性推到了不合适的位置。正如你在下面看到的。任何帮助都将被感激，这可能是我在css中忽略的东西，我不确定

我正在努力实现以下目标：

我的代码是：

h3{
填充：0；
保证金：0；
字体：'CenturyGothic'，CenturyGothic，AppleGothic，无衬线；
颜色：#6b；
左缘：30%；
溢出：隐藏；
}
/*订单图标*/
订单{
背景：url（“./Images/bell1.png”）不重复！重要；
显示：内联块；
垂直对齐：中间对齐；
浮动：左；
左缘：20%；
背景位置：0；

---

试试看。这有点不合常规，但对于导航项目来说效果非常好。为了可读性和现代网络，我对html和css进行了一些重新组织。translateY在IE9以下的版本上不起作用，所以如果你要这样做，请坚持垂直对齐

您为您的

锚定

和

h3

标记定义了相同的ID。ID是唯一的。其中一个ID没有使用，是为了反复试验的目的放在那里的。非常感谢！一旦我做了一些调整，它现在就可以工作了

<a id="order" class="header" href="#" onclick="toggleVisibility('Order');">
 <h3>Orders</h3>
</a>