Html 小型设备上的引导4右菜单

在xs设备中，我需要在左侧放置徽标图像，在右侧放置导航 sm设备的中央和左侧的标志图像以及导航。 使用我的代码，导航在xs中不向右对齐

问题是：如何在xs设备中对齐右侧导航

<div class="container-fluid border-bottom">
<div class="row d-flex align-items-sm-center">
<div class="col-6 col-sm-2 logo pt-2 pb-2 text-sm-center order-sm-2"> <img src="myimage.png"> </div>
<div class="col-6 col-sm-5 order-sm-1">
  <nav class="navbar navbar-expand-lg navbar-light">
    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup"
        aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
    <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
      <div class="navbar-nav"> <a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a> <a
                class="nav-item nav-link" href="#">Azienda</a> <a class="nav-item nav-link" href="#">Prodotti</a> <a class="nav-item nav-link disabled"
                    href="#">Cataloghi</a> </div>
    </div>
  </nav>
</div>
<div class="d-none col-sm-block col-sm-5 order-sm-3">&nbsp;</div>
</div>
</div>

---

在这种情况下，您将使用响应性flexbox util类

justify content end justify content sm start

<div class="container-fluid border-bottom">
    <div class="row d-flex align-items-sm-center">
        <div class="col-6 col-sm-2 logo pt-2 pb-2 text-sm-center order-sm-2"> <img src="//placehold.it/130x40"> </div>
        <div class="col-6 col-sm-5 order-sm-1">
            <nav class="navbar navbar-expand-lg navbar-light justify-content-end justify-content-sm-start">
                <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarNavAltMarkup" aria-controls="navbarNavAltMarkup" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button>
                <div class="collapse navbar-collapse" id="navbarNavAltMarkup">
                    <div class="navbar-nav align-items-sm-start align-items-end"> 
                    <a class="nav-item nav-link active" href="#">Home <span class="sr-only">(current)</span></a>
                    <a class="nav-item nav-link" href="#">Azienda</a> 
                    <a class="nav-item nav-link" href="#">Prodotti</a> 
                    <a class="nav-item nav-link disabled" href="#">Cataloghi</a> 
                    </div>
                </div>
            </nav>
        </div>
        <div class="d-none col-sm-block col-sm-5 order-sm-3">&nbsp;</div>
    </div>
</div>

---

完美正是我想要的。请接受答案，让其他人知道问题已经解决。