Html CSS菱形，在导航条的中间 < >我的代码在本地显示正确，在导航栏中间有菱形，但是“Plus”符号缺少底部。（这是我想知道如何修复它）

然而，在我将代码粘贴到JSfiddle和Codepen.io之后，前景发生了显著的变化

CSS

提前感谢您的慷慨帮助。

试试这个：

#plusSign {
   color: #fff;
   font-size: 2em;
   margin: 0 0 0 -9px;
   position: absolute;
   top: 29px;
   z-index: 100000;
}

---

修复了此代码的问题

#plusSign {
    margin-left: -14px;
    color: #fff;
    font-size: 3em;
    position: absolute;
    top: 0;
    z-index: 100;
}

---

但是有人能解释为什么codePen和JSFIDLE不能正确显示我的代码吗？

谢谢你的帮助，绝对值在这里做什么？我用这段代码使它看起来更好，#plusSign{margin left:-14px；color:#fff；font size:3em；position:absolute；top:0；z-index:100；}但问题是我不知道当它进入响应站点时会是什么样子。.绝对将加号与菱形相对对齐。

#plusSign {
    margin-left: -14px;
    color: #fff;
    font-size: 3em;
    position: absolute;
    top: 0;
    z-index: 100;
}