title: Align right bootstrap navbarsupportedcontent
body: <p>I've tried multiple ways of placing the different supported content of my navbar at the right of the screen, but they keep sticking left next to the logo.
  Does someone have an idea why...</p>
  
  <pre><code>&lt;nav class="navbar navbar-expand-lg navbar-light bg-light"&gt;
  &lt;a class="navbar-brand" href="#"&gt;
  &lt;img src="icone.png" width="38" height="30" class="d-inline-block align-top" 
  alt="sharkstein"&gt; Sharkson &amp; Vonstein
  &lt;/a&gt;
  
  &lt;div class="collapse navbar-collapse" id="navbarSupportedContent"&gt;
  &lt;ul class="navbar-nav mr-auto" id="navbarSupportedContentList"&gt;
    &lt;li class="nav-item active"&gt;
      &lt;a class="nav-link" href="index.html"&gt;Home &lt;span class="sr-only"&gt;(current)
  &lt;/span&gt;&lt;/a&gt;
    &lt;/li&gt;
    &lt;li class="nav-item"&gt;
      &lt;a class="nav-link" href="blog.html"&gt;Blog&lt;/a&gt;
    &lt;/li&gt;
  &lt;/div&gt;
  &lt;/nav&gt;
  </code></pre>
  
  <p>And the css, I've tried with SupportedContentList also and with class</p>
  
  <pre><code>#navbarSupportedContent {
  display: inline-block;
  margin-right: auto;
  float: right;
  text-align: right;
  }
  </code></pre>