0
我想移动下拉菜单，但我的问题是，在我的菜单中的项目不加之间的空间。 我已经试图改变widht，但它不在中心了。 它应该是什么样子。 
如何自己居然看 
HTML移动菜单sizeing
/* When the user clicks on the button,
toggle between hiding and showing the dropdown content */
function myFunction() {
document.getElementById("myDropdown").classList.toggle("show");
}
// Close the dropdown if the user clicks outside of it
window.onclick = function(e) {
if (!e.target.matches('.dropbtn')) {
var myDropdown = document.getElementById("myDropdown");
if (myDropdown.classList.contains('show')) {
myDropdown.classList.remove('show');
}
}
}* {
margin 0;
box-sizing: border-box;
color: #FFFFFF;
font-family: "Monaco", "Menlo", "Consolas", monospace;
text-align: left
}
body {
padding: 0 1.25em 1.25em 1.25em;
align-items: center;
background-color: #1E1E1E;
display: flex;
flex-direction: column;
justify-content: center;
margin: 0
}
header {
max-width: 70%;
}
h1.undertitle {
margin-top: 0.25em;
margin-bottom: 0.25em;
font-size: 75%;
word-spacing: -0.25em;
}
h1.undertitle::before{
content: none;
}
.container {
overflow: hidden;
background-color: #333;
font-family: Arial
}
.container a {
float: left;
font-size: 1em;
color: white;
text-align: center;
padding: 0.625em 1em;
text-decoration: none;
}
.dropdown {
float: left;
overflow: hidden
}
.dropdown .dropbtn {
cursor: pointer;
font-size: 1em;
border: none;
outline: none;
color: white;
padding: 0.625em 1em;
background-color: inherit;
}
/*.container a:hover,
.dropdown:hover .dropbtn {
background-color: white;
color: black
}*/
.dropdown-content {
display: none;
position: absolute;
background-color: #333;
min-width: 10em;
/*box-shadow: 0em 0.5em 1em 0em rgba(0, 0, 0, 0.2);*/
z-index: 1
}
.dropdown-content a {
float: left;
font-size: 1em;
color: white;
text-align: center;
padding: 0.625em 1em;
text-decoration: none;
}
/*.dropdown-content a:hover {
background-color: #ddd
}*/
.show {
display: block
}<header>
<h1> Alan Pijak</h1>
<h1 class="undertitle">
intressiert sich für <span class="orange w700">Java</span> und <span class="blue w700">C++</span>
</h1>
<div class="container">
<div class="dropdown">
<a class="dropbtn" onclick="myFunction()">Startseite</a>
<div class="dropdown-content" id="myDropdown">
<a href="#">Startseite</a>
<a href="#">Link 2</a>
<a href="#">Link 3</a>
</div>
</div>
</div>
</header>