bootstrap- place avatar far right of a header with dropdown

Question

I'm working on a bootstrap project and i've customly designed my header with a text and logo centered. What i'm finding hard to do right now is how to place and avatar far right inside the header which will serve as a dropdown with the menus account and logout

<div class="row">
    <div style="background-color:#215996;height:60px!important;box-shadow: 5px 5px 5px #DBDBDB;" align="center" class="col-xs-12">
      <h3 style="color:#FFF"> <img src="img/logo.png" width="30" height="30" align="top"> App Control Panel</h3>
    </div>
  </div>

Answer 1

通过使用引导类“ navbar-right”，您可以在标题的最右边放置一些内容

Answer 2

You can use float-right class of Bootstarp 4 to slide anything to right. Here's an example

<div class="row">
    <div class="col-12">One <input type="button" class="btn float-right" value="test"></div>
    <div class="col-12">Two <input type="button" class="btn float-right" value="test"></div>
</div>