Html 为什么一个ul比另一个低

几天前我开始使用html和css，我试图在我的网站顶部制作一个导航器，但我得到了一个奇怪的结果，我的第二个ul 3px比第一个低，而它们的高度都是50 px。为什么会这样

：根目录{
字体大小：10px；
}
*{
填充：0px；
边界：0px；
边际：0px；
颜色：黑色；
文字装饰：无；
列表样式：无；
字体大小：正常；
线高：1；
}
.导航{
背景：rgb（150150）；
宽度：100%；
身高：5雷姆；
}
美国海军{
显示：内联块；
}
.nav ul a{
显示：内联块；
}
.导航ul a：悬停{
背景：rgb（100100）；
}
.a页{
字号：2rem；
填充：1.5雷姆；
}
.家{
显示：内联块；
}
.家里有一个李{
字体大小：3rem；
填充：1rem；
}

马克·奥利曼

正在向UL中的项目添加填充。这一点尤其重要

.pages a {
    font-size: 2rem;
    padding: 1.5rem;
}

看看下面的内容。而且你的HTML标记是错误的

：根目录{
字体大小：10px；
}
*{
填充：0px；
边界：0px；
边际：0px；
颜色：黑色；
文字装饰：无；
列表样式：无；
字体大小：正常；
线高：1；
框大小：边框框；/*确保填充保持在框的内部*/
}
.导航{
背景：rgb（150150）；
宽度：100%；
身高：5雷姆；
}
美国海军{
垂直对齐：中间；/*确保所有东西都在中心对齐*/
}
.nav ul、.nav li、.nav a{
显示：内联块；
}
.导航a:悬停{
背景：rgb（100100）；
}
.a页{
字号：2rem；
填充：1.5雷姆；
}
.家a{
字体大小：3rem；
填充：1rem；
}

马克·奥利曼

<nav class="nav">
  <ul class="home">
    <li><a href="">test</a></li>
  </ul>
  <ul class="pages">
    <li><a href="">Contact</a></li>
  </ul>
</nav>