html - 不是所有li元素的背景图都显示出来

Question

我有一个带有垂直分隔符的 Bootstrap 导航，分隔符实际上是 li 的 元素的背景图像。

这是分隔符的代码:

.navbar-default li + li {
    background:url('../images/buffer1.png') no-repeat top right;
    background-size: auto 90%;
    background-position:right center;
    display: block;

}

这是一个活生生的例子:http://www.bootply.com/QojGnD6oyU

问题是在 Firefox 和 IE(所有版本)中，不是显示 6 个垂直分隔符，而是只显示 4 个或 3 个。

为什么以及如何解决？

Answer 1

好的，这是一个有效的修复，宽度已更改为 1px 而不是自动:

.navbar-default li + li {
    background:url('http://nave.net23.net/buffer1.png') no-repeat top right;
    background-size: 1px 75%;
    background-position:right center;
    display: block;

}