我试图让我的导航位于页面的右侧,目前它在中间

I am trying to get my navigation to be on the right side of the page, currently it is in the middle

我想让我的导航位于页面的右侧,目前它位于中间。我对 css 做了一些操作,但无法弄清楚我做了什么,现在导航不会返回到页面右侧,它卡在中间。

.sample-css{
}
<html>

<head>


</head>

<body>
  <div class="flex-container">
    <div class="container">
      <div class="nav-wrapper">
        <div class="left-side">
          <div class="container-logo">
            <div>
              <a name="top"></a>
            </div>
            <div>
              <a href="index.html"><img src="images/Logofor Web1-01.png" alt="Morpheus Design Studios Logo" style="width: 149px; height: 100px;" /></a>
            </div>
          </div>
        </div>
        <div class="nav-wrapper">
          <div class="right-side">
            <div class="nav-link-wrapper"><a href="index.html">HOME</a></div>
            <div class="nav-link-wrapper"><a href="gallery.html">GALLERY</a></div>
            <div class="nav-link-wrapper"><a href="about.html">ABOUT</a></div>
            <div class="nav-link-wrapper"><a href="contact.html">CONTACT</a></div>
            <div class="dropdown">
              <div class="conbtn">
                <div class="nav-link-wrapper">
                  <a href="services.html">SERVICES</a>

                  <div class="dropdown-content"><a href="graphicdesign.html">Graphic Design</a><a href="photography.html">Photography</a><a href="printing.html">Professional Printing</a></div>
                </div>
              </div>
            </div>
          </div>
          <div class="burger">
            <div class="line1"></div>
            <div class="line2"></div>
            <div class="line3"></div>
          </div>
        </div>
      </div>

    </div>
</body>

</html>

更改以下内容:

.nav-wrapper {
  justify-content: center;
}

至:

.nav-wrapper {
  justify-content: flex-end;
}

阅读更多:justify-content(MDN)