UL 不会以 Div 为中心。填充不会修复它。保证金要么

Question

我经常看到这个问题，但我找不到填充或边距的答案。出于某种原因，我无法将 ul 元素正确地置于 div 的中心，而 div 需要这样。

有人可以解释我做错了什么以及如何解决吗？

https://jsfiddle.net/norbertoalexander/4ea23bbn/2/

/* FUENTES
font-family: 'Lobster', cursive;
font-family: 'Playfair Display', serif;
*/

/*
Fondo = #FEFFA0
Borde = #ACDB86
Fondo Texto = #EEEEEE
Hoover = #547C66
Letras = #3B5B5D
*/

html, body {
 height: 100%;
 margin: 0;
 background-color: #FEFFA0;
}

div.head {
 height: 70px;
 background-color: #ACDB86;
 margin: 0 auto;
}

h1 {
 font-family: 'Lobster', cursive;
 font-size: 45px;
 text-align: center;
}

div.menu {
 border-style: solid;
 border-color: blue;
 margin: 5px;
 float: left;
 width: 150px;
 height: 500px;
 list-style: none;
 text-align: center;
}

ul {
 margin: 0 auto;
 list-style: none;
 text-align: center;
 font-size: 20px;
}

li {
 margin: 0 auto;
 text-align: center;
}

h2 {
 text-align: center;
 font-size: 25px;
 font-family: 'Lobster', cursive;
}

div.fuent {
 border-style: solid;
 border-color: blue;
 margin: 5px;
 float: right;
 width: 150px;
 height: 500px;
}

div.leng {
 border-style: solid;
 border-color: yellow;
 margin: 5px;
 width: 72%;
 float: left;
}

div.resu {
 border-style: solid;
 border-color: blue;
 margin: 5px;
 width: 72%;
 float: left;
}

<!DOCTYPE HTML">
<html>
<head>
<title>Lenguajes</title>
<meta charset="utf-8">
<link href="https://fonts.googleapis.com/css?family=Lobster|Playfair+Display" rel="stylesheet">
<link href="styles/leng.css" rel="stylesheet" type="text/css">
</head>
<body>
 <!--titulo-->
 <div class="head">
 <h1>Lenguajes</h1>
 </div>
 <div class="menu">
  <ul>
   <li><h2>Menu</h2></li>
   <li><a href="index.html">Incio</a></li>
   <li><a href="algoritmo.html">Algoritmos</a></li>
   <li><a href="lenguajes.html">Lenguajes</a></li>
   <li><a href="problemas.html">Problemas</a></li>
   <li><a href="about.html">Sobre mi</a></li>
  </ul>
 </div>
 <div class="fuent">
 Fuentes
 </div>
 <div class="resu">
 Resumen
 </div>
 <div class="leng">
 Lenguaje
 </div>
</body>


</html>

Answer 1

<ul> 上有一个填充，将其移除，菜单居中：

ul {
    padding: 0;
}

UL 不会以 Div 为中心。填充不会修复它。保证金要么

UL won't center on the Div. Padding won't fix it. Margin either

html

css

center

padding

html-lists