フレックスボックスを使用して左側にロゴを整列させ、右側にアイテムをナビゲートします

Question

私は左側にロゴを、もう一方にはロゴを入れます。

フロートを使用しようとしましたが、右側のフロートがヘッダーの下部に固定されていました。

フレックスボックスも試していますが、私がしたいことはしていません。

<header> 
 
    <a id="logo" href="#">Logo</a> 
 
    <nav> 
 
    <ul> 
 
     <li><a id="aboutus" href="#">About Us</a></li> 
 
     <li><a id="login" href="#">Log In</a></li> 
 
    </ul> 
 
    </nav> 
 
</header>

これを実行する最も簡単な方法上の任意のアドバイスは？

Answer 1

<style> 
ul { 
list-style-type: none; 
} 

li { 
float: right; 
} 

li a { 
display: block; 
text-align: center; 
padding: 14px 16px; 
} 

</style> 

<header> 
    <a style="float:left" id="logo" href="#">Logo</a> 
    <nav > 
     <ul > 

      <li><a id="aboutus" href="#">About Us</a></li> 
      <li><a id="login" href="#">Log In</a></li> 
     </ul> 
    </nav> 
</header> 

ここでは、この