センターのメニューCSS私はCSSでこのトップメニューをセンタリングする方法

Question

：

私はこのHTML構造を有する：

<div class="wrapper_menu_hoz"> 
    <div class="container_24 "> 
     <div class="grid_24 em-area05"> 
      <div class="nav-container"> 
       <ul id="nav"> 
       </ul> 
      </div> 
     </div> 
    </div> 
</div> 

Answer 1

これを行うにはいくつかの方法があります。それはまた、残りの項目に持っているもののコードに依存しますが、基本的にこれはそれを行う方法です：

はuがチェックしたスニペット

ul { 
 
    text-align:center; 
 
    display: block; 
 
    margin: 0 auto; 
 
    padding:0; 
 
    width:100%; 
 
} 
 
ul > li { 
 
    display: inline-block; 
 
    padding:0 15px; 
 
}

<div class="wrapper_menu_hoz"> 
 
    <div class="container_24 "> 
 
     <div class="grid_24 em-area05"> 
 
      <div class="nav-container"> 
 
       <ul id="nav"> 
 
       <li>ITEM</li> 
 
       <li>ITEM</li> 
 
        <li>ITEM</li> 
 
       
 
        <li>ITEM</li> 
 
       </ul> 
 
      </div> 
 
     </div> 
 
    </div> 
 
</div>

Answer 2

を私はナビゲーション要素にmargin: 0 auto;を追加することをお勧め、彼のことを覚えています親は身体の100％幅でなければならない