在CSS中对齐标题

Question

我的标题有问题。即，导航标签低于徽标，我不知道该如何对齐。我尝试用填充调整导航，但最终无法使用。

CSS：

    html body {
      font-family: 'Work Sans', sans-serif;
      color: DimGrey;
      margin: 0;
      padding: 0 24px;
      width: auto;
    }
    
    /*
    header {
      height: 64px;
      margin: 10px 24px 10px 24px;
      }
    */
    
    nav {
      text-align: right;
    }
    
    nav li {
        justify-content: space-between;
        align-items: center;
        margin: 0 16px 0 0;
        list-style: none;
        display: inline-block;
    }
    
    p {
      font-size: 14px;
      padding: 8px 0;
    }
    
    .name1, .name2 {
      font-size: 32px;
      display: flex;
      text-align: center;
      font-weight: lighter;
    }
    
    .name1 {
      color: DarkGrey;
    }
    
    .logo {
      display: flex;
      text-align: center;
      margin: 0;
    }
    
    .imglogo {
      height: 50px;
      margin-top: 20px;
    }

请告知我做错了什么。

Answer 1

将下面的此样式添加到您的CSS：

header{
 display: flex;
 align-items: center;
 justify-content: space-between;
}