Bootstrap Navbar中的中心图像没有重叠

Question

我试图找出两个问题。

1。 我已经看到了很多关于如何将图像置于引导导航栏中间的示例，但是，我在确定如何在屏幕上防止图像重叠链接时遇到问题缩小到较小的尺寸（不会触发汉堡包菜单）

实施例： JS Fiddle Example

如果您慢慢缩小屏幕，您会看到中心图标与“报告”重叠。链接。我该如何防止这种情况发生？有没有办法让图像识别最后一个链接的边缘而没有重叠呢？

2。 导航栏是否有办法根据图像的高度调整高度，而不是重叠导航栏的图像？

代码：

{{1}}