html - How can I align this menu to be center? -


i have site:

link

code html:

<div class="content-menu">     <div class="navbar navbar-inverse bs-docs-nav" role="banner">         <div class="navbar-header">             <button class="navbar-toggle" data-target=".bs-navbar-collapse" data-toggle="collapse" type="button"><span class="sr-only">toggle navigation</span> <span class="icon-bar"></span> <span class="icon-bar"></span> <span class="icon-bar"></span></button>             <div class="logo-mobile">                 <a href="#"><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/logo-mobile.png"></a>                 <ul class="lang-top navbar-right">                     <li>                         <a href="#">en</a>                     </li>                     <li>                         <a href="#">fr</a>                     </li>                 </ul>             </div>         </div>         <nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">             <div class="menu-menu-1-container">                 <ul class="nav navbar-nav" id="menu-menu-1">                     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-22" id="menu-item-22">                         <a href="http://dg-design.ch/bagel/?page_id=4" title="home">home</a>                     </li>                     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-27" id="menu-item-27">                         <a href="http://dg-design.ch/bagel/?page_id=10" title="news">news</a>                     </li>                     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-65" id="menu-item-65">                         <a href="http://dg-design.ch/bagel/?page_id=63" title="events">events</a>                     </li>                     <li class="menu-item menu-item-type-custom menu-item-object-custom menu-item-71" id="menu-item-71">                         <a href="http://www.smood.ch/en/156_bagel-house-caf%c3%a9" target="_blank" title="delivery">delivery</a>                     </li>                     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-23" id="menu-item-23">                         <a href="http://dg-design.ch/bagel/?page_id=6" title="about us">about us</a>                     </li>                     <li class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25" id="menu-item-25">                         <a href="http://dg-design.ch/bagel/?page_id=12" title="contact">contact</a>                     </li>                 </ul>             </div>             <ul class="lang-top navbar-right">                 <li><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/logo-menu.png"></li>                 <li class="icon"><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/menu.png"></li>                 <li class="icon">                     <a href="#">menu</a>                 </li>                 <li class="icon">                     <a href="#">en</a>                 </li>                 <li class="icon">                     <a href="#">fr</a>                 </li>                 <li class="icon"><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/menu.png"></li>                 <li class="icon"><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/menu.png"></li>                 <li class="icon"><img src="http://dg-design.ch/bagel/wp-content/themes/wp_bagel/assets/img/menu.png"></li>             </ul>         </nav>     </div> </div> 

code css:

.wrapper .content .content-menu {   /* width: 91%; */   /*background: #5b626a;*/   position: absolute;   z-index:9999;   /* left: 4%; */   margin: 0 auto;   left: 0;   top: 0;   right: 0; } 

i tried put above code "text align: center" unfortunately not work. can tell me please why not work?

what must change items aligned in center on resolution?

enter image description here

try this:

html

<nav class="collapse navbar-collapse bs-navbar-collapse" role="navigation">         <div class="menu-menu-1-container">             <ul class="nav navbar-nav" id="menu-menu-1"></ul>             <ul class="lang-top navbar-right"></ul>         </div> </nav> 

css

collapse navbar-collapse bs-navbar-collapse{     margin: 0px auto;     width: 1500px; } 

enter image description here


Comments

Popular posts from this blog

java - pagination of xlsx file to XSSFworkbook using apache POI -

Unlimited choices in BASH case statement -

apache - How do I stop my index.php being run twice for every user -