Navbar가 센터

Question

코딩에 내 첫 해이고 나는 학교 프로젝트를 위해 이것을하고있다. 우리는 응답 성있는 사이트를해야하고 내 사이트에 navbar를 추가하려고 할 때 이미 문제에 직면하고 있습니다. 내가 그것을 추가 할 때마다, 그것은 단지 왼쪽으로 너무 많이 들어가서 중간에 가지 않을 것이다. 나는 도움을 google를 찾는 것을 시도했다 그러나 그 (것)들의 아무도는 그래서 나가 질문 할 것을 여기에서 등록 할 것이라는 점을 생각했다. 미리 감사드립니다!

body { 
 
    background: white none; 
 
    color: black; 
 
    /* jätetään ylämarginaalia navigointipalkin tilan verran */ 
 
    margin-top: 0em; 
 
    /* jätetään vasempaan laitaan marginaalia saman verran kuin 
 
    laitaan tuleva linkkialue vie */ 
 
    margin-left: 24.5%; 
 
    padding: 0.5em; 
 
    margin-right: 24.5%; 
 
    margin-top: 10 
 
} 
 
body { 
 
    background-image: url("8.jpg"); 
 
} 
 

 
#logo { 
 
    margin-left: 0px; 
 
    margin-top: -180px; 
 
} 
 

 
ul { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    overflow: hidden; 
 
    background-color: Green; 
 
} 
 

 
li { 
 
    float: left; 
 
} 
 

 
li a { 
 
    display: block; 
 
    color: white; 
 
    text-align: center; 
 
    padding: 14px 16px; 
 
    text-decoration: none; 
 
} 
 

 
li a:hover { 
 
    background-color: #89F52B; 
 
}

<ul> 
 
    <li><a href="#home">Etusivu</a></li> 
 
    <li><a href="#games">Pelit</a></li> 
 
    <li><a href="#news">Palaute</a></li> 
 
    <li><a href="#contact">Yhteystiedot</a></li> 
 
    <li><a href="lomake.html">Lomake</a></li> 
 
</ul> 
 

 
<div id="logo"> 
 
<img src=""/> 
 
</div>

Answer 1

당신은 당신의 메뉴 항목 @Pete 말했듯이 단지 수행 전체 메뉴 바의 내부를 중심으로하려면 다음

li { 
    display: inline-block; 
} 

ul { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
    overflow: hidden; 
    background-color: Green; 
    text-align: center; <----------- 
} 

body { 
 
    background: white none; 
 
    color: black; 
 
    /* jätetään ylämarginaalia navigointipalkin tilan verran */ 
 
    margin-top: 0em; 
 
    /* jätetään vasempaan laitaan marginaalia saman verran kuin 
 
    laitaan tuleva linkkialue vie */ 
 
    margin-left: 24.5%; 
 
    padding: 0.5em; 
 
    margin-right: 24.5%; 
 
    margin-top: 10 
 
} 
 
body { 
 
    background-image: url("8.jpg"); 
 
} 
 

 
#logo { 
 
    margin-left: 0px; 
 
    margin-top: -180px; 
 
} 
 

 
ul { 
 
    list-style-type: none; 
 
    margin: 0; 
 
    padding: 0; 
 
    overflow: hidden; 
 
    background-color: Green; 
 
    text-align: center; 
 
} 
 

 
li { 
 
    display: inline-block; 
 
} 
 

 
li a { 
 
    display: block; 
 
    color: white; 
 
    text-align: center; 
 
    padding: 14px 16px; 
 
    text-decoration: none; 
 
} 
 

 
li a:hover { 
 
    background-color: #89F52B; 
 
}

<ul> 
 
    <li><a href="#home">Etusivu</a></li> 
 
    <li><a href="#games">Pelit</a></li> 
 
    <li><a href="#news">Palaute</a></li> 
 
    <li><a href="#contact">Yhteystiedot</a></li> 
 
    <li><a href="lomake.html">Lomake</a></li> 
 
</ul> 
 

 
<div id="logo"> 
 
<img src=""/> 
 
</div>