使用vw,vh,rem布局ul里的a标签的文字的位置出现错误

Question

问题遇到的现象和发生背景

问题背景：火狐浏览器运行，html设置了font-size：6.5105vw;文字大小为100px，a标签设置了font-size:0.16rem;文字大小为16px，行高为60px。
问题现象：a标签的文字不在行高内，文字位置不正常，当我把html的font-size：6.5105vw;去掉，a标签就恢复了行高，文字位置恢复正常。

问题相关代码，请勿粘贴截图

            <div class="header-in div-in">
                <h1><a href="#"><img src="images/nubia-logo1.png" title="努比亚" alt="努比亚logo"></a></h1>
                <ul class="nav">
                    <li><a href="#">首页</a></li>
                    <li><a href="#">商城</a></li>
                    <li><a href="#">产品</a></li>
                    <li><a href="#">应用</a></li>
                    <li><a href="#">服务</a></li>
                    <li><a href="#">体验店</a></li>
                    <li><a href="#">社区</a></li>
                </ul>
                <div class="user"><i></i><a href="#">注册</a><a href="#">登录</a></div>
            </div>
        </div>

html{
  font-size:6.5105vw;
  width:100vw;
  height:100vh;
}
.header{
    background:#000;
}
.header-in{
    height:8.0129vh;
    display:flex;
    justify-content:space-between;
    line-height: 8.0129vh;
}
.header-in h1 img{
    width:6.89vw;
}
.nav{
    width:35.878vw;
    height:100%;
    display:flex;
    justify-content:space-between;
}
.nav li{
    height:100%;
    text-align:center;
}
.nav a{
    font-size:0.16rem;
    color:#fff;
}

我想要达到的结果

html继续使用font-size:6.5105vw;并让a标签的文字位置恢复正常，在行高内。

Answer 1

li 继承了header-in 的line-height 改一下li的line-height