水平中心搜索栏引导程序导航

Question

我正在尝试将搜索栏居中在我的导航栏中。我使用bootstrap，我尝试了md-4上的文本中心，但它没有任何效果。

这是我的代码的链接。

http://bootsnipp.com/snippets/50b38

Answer 1

在CSS中标记你的代码，我把那似乎扫

.top-header { 
    background-color: #D9D9D9; 
    text-align:center; 
} 

期待它帮助你

Answer 2

引导使用12列的网格。你的代码的第一列是8，第二列是4.这意味着你的第一列将是页面的2/3。通过制作col-md-4，它可以让你的中间div成为中心。

<div class="row top-header"> 
    <div class="container"> 
     <div class="col-md-4"> 
     <img src="https://placeholdit.imgix.net/~text?txtsize=30&txt=320%C3%97240&w=235&h=126" alt="logo image" /> 
     </div> 
     <div class="col-md-4"> 
      <div id="search-center"> 
       <div class="input-group"> 
        <input type="text" class="form-control input-lg" placeholder="Search" /> 
        <span class="input-group-btn"> 
         <button class="btn btn-info btn-lg" type="button"> 
          <i class="glyphicon glyphicon-search"></i> 
         </button> 
        </span> 
       </div> 
      </div> 
     </div> 
    </div> 
    </div> 

下面是一个更新的源： http://bootsnipp.com/user/snippets/E7WgX