获取导航栏的中心元素

我有一个像下面的导航栏。我如何以元素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

获取导航栏的中心元素

回答

相关问题