title: Toggle menu from right instead of left
body: <p>I have a menu that can toggle from the left, but I need to be able to toggle from the right. Not sure if this can be triggered from jQuery, or can be done in CSS. It also scrolls horizontally in the toggled navigation, when it should only scroll vertically.</p>
  
  <pre><code>&lt;div id="wrapper"&gt;
  &lt;!-- Sidebar --&gt;
  &lt;div id="sidebar-wrapper"&gt;
      &lt;ul class="sidebar-nav"&gt;
          &lt;li class="sidebar-brand"&gt; &lt;a href="#"&gt;
                      Entertainment
                  &lt;/a&gt;
  
          &lt;/li&gt;
          &lt;div class="container"&gt;
              &lt;div class="row"&gt;
                  &lt;div class="col-md-3"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;div class="caption"&gt;
                               info
                      &lt;/div&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/div&gt;
  &lt;/div&gt;
  &lt;div id="page-content-wrapper"&gt;
      &lt;div class="container-fluid"&gt;
          &lt;nav class="navbar navbar-default" role="navigation"&gt;
              &lt;div class="container-fluid"&gt;
                  &lt;!-- Brand and toggle get grouped for better mobile display --&gt;
                  &lt;div class=""&gt;
                      &lt;ul class="nav navbar-nav navbar-left"&gt;
                          &lt;li&gt;
                              &lt;img src="logo.png" height="50"&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
                  &lt;div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"&gt;
                      &lt;ul class="nav navbar-nav navbar-right"&gt;
                          &lt;li&gt;&lt;a href="" height="30"&gt;&lt;/a&gt;
  
                          &lt;/li&gt;
                      &lt;/ul&gt;
                  &lt;/div&gt;
              &lt;/div&gt;
          &lt;/nav&gt; &lt;a href="#menu-toggle" class="btn btn-default" id="menu-toggle"&gt;Toggle Menu&lt;/a&gt;
  
      &lt;/div&gt;
  &lt;/div&gt;
  &lt;!-- /#page-content-wrapper --&gt;
  </code></pre>
  
  <p></p>
  
  <p><strong><a href="http://jsfiddle.net/mattography/gcqLds56/" rel="nofollow">JSFIDDLE</a></strong></p>