在小屏幕上保持導航欄ul水平位置

Question

我有一個Bootstrap導航欄，其中有2個ul。

第一個UL隱藏在小屏幕上的摺疊菜單中。

第二個UL仍然可見。

我遇到的問題是，第二個UL總是垂直顯示。我似乎無法覆蓋它水平顯示。我繼續檢查CSS，但沒有發現似乎控制。

http://www.bootply.com/render/121627

（一些CSS的從// Twitter bootstrap 3 navbar navbar-right outside navbar-collapse借來的）澄清：

這是我看到< 760px寬屏幕：

[ brand ]  -item1  [---] 
       -item2 

這是我想看到的：

[ brand ] -item1 -item2 [---] 

Answer 1

解決方案的目標是在導航欄上的ul> li。

.navbar-right > ul > li { float:left; } 

Answer 2

這是我在一個類似的情況什麼工作：

.navbar-right { 
    float: right; 
} 

.navbar-right > li { 
    float: left 
} 

.navbar-right > li > a { 
    display: block; 
} 

Answer 3

自舉4：

.navbar-nav { flex-direction:row !important; }