水平对准导航栏元素 - 自举3

Question

我想与下列元素

菜单（按钮）的序列来显示响应视图的导航栏 - BRAND（居中） - 搜索 （图标） - 登录（图标）

我已经尝试了很多方法来完成它，但没有成功。目前他们在移动解决方案中看到三排。

以下是在>bootply

对于桌面视图的代码，所述元件排列按照需要的序列。

是否可以将它们全部按照指定的顺序排列在移动视图中？

Answer 1

使用此：

@media screen and (max-width: 768px) { 
    .row { 
     position: relative; 
    } 

    .navbar-header { 
     left: 0; 
     position: absolute; 
     top: 0; 
    } 

    .navbar-brand { 
     float: none; 
     box-sizing: border-box; 
     height: 50px; 
     padding: 14px 50px; 
     text-align: center; 
     width: 100%; 
    } 

    .navbar-right { 
     margin: 0; 
     position: absolute; 
     right: 0; 
     top: 0; 
    } 

    .navbar-right > li { 
     display: inline-block; 
     margin-top: 4px; 
    } 
} 

演示：http://www.bootply.com/125720