html - 要在导航栏旁边放置 Logo ？

Question

考虑这个标记:

 <nav>
    <div id="logo"><img src="logo.png" height="44PX"/></div>
       <ul id="navItems">
                    <li><a href="#"">Link1</a></li>
                    <li><a href="#">Link2</a></li>
       </ul>
 </nav>

我使用这个 css 代码来设计样式:

#navItems
{ 
    display:flex;
    z-index:1;
    position:fixed;
    top:0;
    background-color:#333;
    width:92%;
    height:44px;
    list-style-type:none;
}

如何将 Logo 放在左侧，紧挨着导航栏？

Answer 1

如果你正在使用 display:flex，你不能只使用 display:inline-flex 吗？

#logo {
  display: inline-flex;
}

#navItems
{ 
  display:inline-flex;
  z-index:1;
  position:fixed;
  top:0;
  background-color:#333;
  width:92%;
  height:44px;
  list-style-type:none;
}

<nav>
  <div id="logo"><img src="logo.png" height="44PX"/></div>
  <ul id="navItems">
    <li><a href="#">Link1</a></li>
    <li><a href="#">Link2</a></li>
  </ul>
</nav>