nav에서 오른쪽 정렬하는 방법은 무엇입니까?

Question

드롭 다운 메뉴를 navbar에 추가하려고합니다. 그러나 아이콘이 오른쪽 정렬되어있는 동안 dropdown-menu-right을 사용하더라도 메뉴가 왼쪽 정렬로 열립니다. 포지셔닝을 위해 포핏 (poppr)에 대해 언급 한 것을 보았습니다 - nav 제외. 그러면 어떻게 메뉴를 오른쪽 정렬 할 수 있습니까? 여기

바이올린 : https://jsfiddle.net/mbaas/dk3tpeex/5/

<nav id="TOP" class="navbar navbar-light d-flex"> 
    <div class="navbar-brand d-inline">BLA</div> 
    <div data-toggle="dropdown" class="navbar-brand d-inline ml-auto" id="menu" aria-expanded="false"><span class="fa fa-bars"></span></div> 
    <div class="dropdown-menu dropdown-menu-right" aria-labelledby="menu"> 
    <button onclick="javascript:alert('Hi!');" class="dropdown-item" type="button" id="toggleLeft">MenuItem</button> 
    </div> 
</nav> 

Answer 1

나는 dropdown-menu 클래스의 다음과 같은 속성 변경 것이 특정한 경우 :

.dropdown-menu { 
    left: initial; 
    right: 0; /* add right with 0 or a low pixel value */ 
} 

당신은 또한 자신의 클래스와 재정의를 만드는 방법에 따라 수를 이 dropdown-menu 클래스의 원래 특성 당신은 메뉴 바에서 표준 드롭 다운 버튼을 사용하려는 때문에

#dd.dropdown-menu { 
    left: initial; 
    right: 0 
}