獲取導航欄的中心元素

我有一個像下面的導航欄。我如何以元素Help Video爲中心。獲取導航欄的中心元素

.header_title{ 
 
     font-size: 20px; 
 
     color: white; 
 
    } 
 

 
    .center { 
 
     text-align:center; 
 
    } 
 
    
 
    .center { 
 
     float:none; 
 
     display:inline-block; 
 
     *display:inline; /* ie7 fix */ 
 
     *zoom:1; /* hasLayout ie7 trigger */ 
 
     vertical-align: top; 
 
    }

<div class="navbar navbar-default navbar-fixed-top navbar_form" role="navigation"> 
 
     <div class="navbar-header"> 
 
     <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
 
      <span class="sr-only">Toggle navigation</span> 
 
     </button> 
 
     <a class="navbar-brand" href="/"><font class="header_title" >Some text</font></a> 
 
     </div> 
 
    
 
     
 
     <!-- Fixed navbar I want to center this.--> 
 
     <div class="navbar-collapse collapse center"> 
 
      <a class="navbar-brand" href="#"><font class="header_title" >HELP VIDEO</font></a> 
 
     </div> 
 
    </div><!--/.nav-collapse -->

但它不來中心。我在哪裏做錯了？

來源

2015-04-01 user168983

你可以共享一個小提琴？ – 2015-04-01 06:10:08

http://www.bootply.com/NyvCIsZaF1 @GaneshSalunkhe – user168983 2015-04-01 06:13:23

給予保證金：10px 43％，以「幫助視頻」錨（一）元素。 – Puneet 2015-04-01 06:35:56

從樣式表中刪除下面的樣式。

.center { 
float:none; 
display:inline-block; 
*display:inline; /* ie7 fix */ 
*zoom:1; /* hasLayout ie7 trigger */ 
vertical-align: top; 
}

來源

2015-04-01 06:38:09

你可以在小提琴中展示它嗎？ – user168983 2015-04-01 06:41:17

剛剛從.navbar-collapse.collapse {

刪除display: block !important;
，給text-align:center;
到.navbar {。

它將中心幫助視頻部分。

您可以檢查更新的代碼Here.

來源

2015-04-01 06:47:47 ketan

運行的代碼片段，你可以看到，元素能夠幫助視頻對準中心。

.header_title{ 
 
    font-size: 20px; 
 
    color: black; 
 
} 
 
.center { 
 
    text-align:center; 
 
} 
 
/* 
 
Remove these styles 
 

 
.center { 
 
    float:none; 
 
    display:inline-block; 
 
    *display:inline; 
 
    *zoom:1; 
 
    vertical-align: top; 
 
} 
 
*/

<div class="navbar navbar-default navbar-fixed-top navbar_form" role="navigation"> 
 
    <div class="navbar-header"> 
 
    <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
 
     <span class="sr-only">Toggle navigation</span> 
 
    </button> 
 
    <a class="navbar-brand" href="/"><font class="header_title" >Some text</font></a> 
 
    </div> 
 

 

 
    <!-- Fixed navbar I want to center this.--> 
 
    <div class="navbar-collapse collapse center"> 
 
     <a class="navbar-brand" href="#"><font class="header_title" >HELP VIDEO</font></a> 
 
    </div> 
 
</div><!--/.nav-collapse -->

來源

2015-04-01 07:43:11

獲取導航欄的中心元素

回答

相關問題