hmenuの中央オプション

Question

hmenuオプションをどのモニタにも集中させるにはどうすればよいですか？ （CSSのシンプルなセンターは私たちのサイトでは機能しません）。 私はオプションを調べようとしましたが、私たちのコーディングは少し複雑です。

www.sleepstudymo.com

ありがとうございます。

あなたは.sleep-hmenuからfloat: left;を削除し、.desktop .sleep-navにtext-align: center;を追加する必要がドン

Answer 1

：

.desktop .sleep-nav { 
    width: 100%; 
    padding-left: 2px; 
    padding-right: 2px; 
    text-align: center; 
} 
.sleep-hmenu { 
    float: left; /*remove this*/ 
} 

それとも、.desktop .sleep-nav要素とul.sleep-hmenu上margin: 0 autoにflex-wrap: wrap;でdisplay: flex;を使用することができます。

.desktop .sleep-nav { 
    width: 100%; 
    padding-left: 2px; 
    padding-right: 2px; 
    display: flex; 
    flex-wrap: wrap; 
} 
ul.sleep-hmenu { 
    display: inline-block; 
    vertical-align: bottom; 
    padding-left: 5px; 
    padding-right: 5px; 
    -webkit-box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    box-sizing: border-box; 
    margin: 0 auto; 
}