无法为不同的移动屏幕很好地对齐Bootstrap 3导航栏项目

Question

我无法在移动设备上显示导航栏徽标和菜单。它在桌面上看起来不错。小提琴代码位于底部。

这就是iphone 5上的样子：

这就是iphone 6上的样子：

在iPad上看起来更糟糕。我尝试将徽标居中，这是第一个li元素，display:block;和margin:0 auto;无效，即使我事先也将它的父元素集中在一起。

Fiddle

我可以将网站链接到任何有兴趣帮助的人，因为Fiddle由于某种原因没有正确显示。

Answer 1

尝试添加课程

中心阻止和 img-responsive

这是jfiddle示例

http://jsfiddle.net/Lb2xj6p5/8/

<div class="row">
    <div class="col-md-12">
        <img class="img-responsive center-block" src="https://lh5.ggpht.com/Ztm0behQInDnkGpy_6VQNCZ-C8TObFubrNfYi14TuSEPNKrV3G0_GvdxRowtf1U2n9aAuCxw25g3Ih9vXX5Y=s0">
    </div> 
</div>

工作小提琴 http://jsfiddle.net/DTcHh/1777/