센터링 메뉴 링크

Question

나는 메뉴 링크를 중심에 두려고하는데 할 수 없다. (Link to my website). 아시다시피 '홈'및 '스태프'링크는 페이지의 왼쪽에 정렬되어 있지만 가운데에 놓기를 원합니다. 여기

(가능하면 비율로) 당신이

/*Navigation*/ 

    #menu { 
     width: 100%; 
     float: left; 
     margin: 0 0 3em 0; 
     padding: 0; 
     list-style: none; 
     background-color: #1C1C1C; 
     margin-top:85px; 
} 
    #menu li { 
     float: left; } 
    #menu li a { 
     display: block; 
     padding: 30px 30px; 
     text-decoration: none; 
     font-weight: bold; 
     color: #fff; 
     transition: background-color 0.5s ease; 
     transition: color 0.5s ease; 
     } 
    #menu li a:hover { 
     color: #69bfe7; 
     background-color: #2E2E2E; 
     transition: background-color 0.5s ease; 
     transition: color 0.5s ease; 
     } 

여기에 CSS 코드를 HTML 코드를

<!-- Here's all it takes to make this navigation bar. --> 
    <ul id='menu'> 
     <li><a href='#'>Home</a></li> 
     <li><a href='#'>Staff</a></li> 
    </ul> 
    <!-- That's it! --> 

Answer 1

이 시도 :

이

#menu { 
    background-color: #1c1c1c; 
    float: left; 
    list-style: outside none none; 
    margin: 85px 0 3em; 
    padding: 0; 
    text-align: center; 
    width: 100%; 
} 

#menu li { 
    display: inline-block; 
    /* float: left; */ 
} 

Answer 2

이 트릭을 할해야 :

#menu { 
    width: 100%; 
    margin: 0 0 3em 0; 
    padding: 0; 
    list-style: none; 
    background-color: #1C1C1C; 
    margin-top:85px; 
    text-align: center; 
} 

#menu li { 
    display: inline-block; 
}