如何将菜单栏项目左对齐纯JavaScript和CSS

我希望使用一个导航菜单栏，它是从堆栈溢出中的另一篇文章中提取的。这是我的密码

CSS

导航头{
背景色：#06C；字体系列：'opensans'；
}
标题{
宽度：100%；显示：弯曲；对齐项目：居中；
高度：80px；颜色：#FFF；调整内容：flex start；
}/*我们使用flex display将汉堡图标定位在AndroiCSS h2元素的侧面*/
#汉堡包{
光标：指针；
}/*添加小手光标指针，以指示此元素可单击；它在单击时触发jQuery*/
标题*{
利润率：0.15px；
}
.fa钢筋，集管h2{
字体大小：28px！重要；
}
收割台h2{
字体重量：400！重要；
}
导航{
显示：柔性；柔性方向：列；宽度：0；对齐项目：中心；
过渡：宽度0.2s；
}
导航开放{
宽度：250px；
身高：100%；
}
导航关闭{
宽度：0；
}
导航*{
颜色：#FFF！重要；字体系列：'opensans'；字体大小：20px！重要；右边距：15px；
}
导航a{
文字装饰：无！重要；
边框顶部：0.5px纯色灰色；宽度：100%；文本对齐：中心；显示：柔性；对齐项目：中心；对齐内容：中心；高度：55px；
}
导航a：悬停{
背景色：rgba（0,0,0,0.1）；
}/*这将更改悬停在导航元素上时的背景颜色*/

HTML

雄蕊

JAVA脚本

<script>
   $("#hamburger").click(function(){
    $("nav").toggleClass('open', 'close');
});

$("a").click(function(){
    $("nav").toggleClass('open', 'close');
});
    </script>

$（“#汉堡”）。单击（函数（）{
$（“nav”）.toggleClass（“打开”、“关闭”）；
});
$（“a”）。单击（函数（）{
$（“nav”）.toggleClass（“打开”、“关闭”）；
});

我想让左对齐菜单项，左填充10px。（尝试了很多方法，但没有成功）

我想把汉堡图标放在导航栏的右侧

我需要使用纯javaScript关闭外部单击时打开的菜单。（通过单击外部任何位置） 所有人都必须作出反应

请帮我解决这三个问题。非常感谢

这是小提琴：

• 从

  
  反馈：在CSS代码中添加换行符可以提高其可读性：）
  请创建一个加号器/提琴，以便我们了解更多信息。如果您可以使用codepen更新您的问题，则代码中会出现一些错误。1号问题已解决。2号和3号问题仍未解决。帮助我！但导航菜单未完全关闭。几乎没有像素保持打开状态。请鼠标悬停，然后你们可以看到它在左边的边缘。怎么做鞋底？非常感谢，塞尔索·惠灵顿。一切都很好。精彩的编码。非常感谢。但只有一件事必须纠正。Navi面板高度必须为100%。谢谢。我已经解决了你的主要问题。查看原始注释中编辑的JSFIDLE，您将看到答案的更好版本。现在，如果你想推动这样的需求，你可能想雇用一名开发人员为你做这项工作。堆栈溢出是为了帮助您的研究，而不是为您开发产品。
  <header>
      <i id="hamburger" class="fa fa-bars"></i>
      <h2>AndroidCSS</h2>
    </header>
    <nav>
      <a href="#"><i class="fa fa-star"></i>  <span>Terms and conditions</span></a> <!-- nav menu no need for <ul> or <li> tags here -->
      <a href="#"><i class="fa fa-calculator"></i><span>Privacy Policy</span></a>
      <a href="#"><i class="fa fa-envelope"></i><span>About Us</span></a>
      <a href="#)"><i class="fa fa-facebook"></i><span>Help</span></a>
    </nav>
  
  <script>
     $("#hamburger").click(function(){
      $("nav").toggleClass('open', 'close');
  });
  
  $("a").click(function(){
      $("nav").toggleClass('open', 'close');
  });
      </script>