CSS Image会导致菜单出现问题

我有这个JSBIN菜单代码。
我一直试图在菜单中间放一张图片，就像JSBIN代码一样。
但是有两个问题：

• 从左侧菜单（“关于我们”）到边缘的距离和与右侧菜单的距离（“交换参考线”）是不同的。
• 图像会降低菜单。

我试图使用line-height设置并尝试使用图像的位置，但它没有帮助。

谢谢！

Answer 1

试试这个

 .navgroups li { float:left; list-style:none; } 

这是JSBIN并删除显示：内联从此。

Answer 2

您需要在.navgroups .menu添加padding: 0 ：

 .navgroups .menu { display: table; margin: 0 auto; padding: 0; } 

并将.navgroups li更改为：

 .navgroups li { float:left; list-style-type:none; } 

更新了JSBIN