title: How to show Bootstrap dropdown above everything?
body: <p>I have this problem:</p>
  
  <p><a href="https://i.stack.imgur.com/GyEp7.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/GyEp7.png" alt="enter image description here"></a></p>
  
  <p>(sorry for the Greek).</p>
  
  <p>I want this dropdown menu, positioned on top of everything else on the page.
  I don't think that I can use position:fixed, as I want the dropdown to always be below the blue button above it.</p>
  
  <p>Here is the html (I'm using bootstrap):</p>
  
  <p><a href="https://jsfiddle.net/9pLg1kLy/2/" rel="nofollow noreferrer">https://jsfiddle.net/9pLg1kLy/2/</a></p>
  
  <pre><code>&lt;!-- Latest compiled and minified CSS --&gt;
  &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous"&gt;
  &lt;!-- Latest compiled and minified JavaScript --&gt;
  &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js" integrity="sha384-0mSbJDEHialfmuBBQP6A4Qrprq5OVfW37PRR3j5ELqxss1yVqOtnepnHVP9aJ7xS" crossorigin="anonymous"&gt;&lt;/script&gt;
  &lt;div class="navbar-default sidebar" role="navigation"&gt;
      &lt;div id="navbar-root-div" class="sidebar-nav navbar-collapse in"&gt;
          &lt;ul class="nav" id="side-menu"&gt;
              &lt;!--&lt;sidebar-search&gt;&lt;/sidebar-search&gt;--&gt;
              &lt;li ng-show=currentUser ui-sref-active="active"&gt; &lt;a ui-sref="dashboard.map"&gt;&lt;i class="fa fa-map fa-fw"&gt;&lt;/i&gt; Χάρτης&lt;/a&gt;
  
                  &lt;!-- &lt;/li&gt;
              &lt;li ng-show=currentUser ui-sref-active="active"&gt;
                  &lt;a ui-sref="dashboard.chart"&gt;&lt;i class="fa fa-line-chart fa-fw"&gt;&lt;/i&gt;&amp;nbsp;Δείκτες Απόδοσης&lt;/a&gt;
              &lt;/li&gt;--&gt;
                  &lt;li id="deleteDevicePathsID" ng-show="devicePaths.p1" ui-sref-active="active"&gt; &lt;a href="" ng-click='deletePaths()'&gt;&lt;i class="fa fa-trash-o fa-fw"&gt;&lt;/i&gt; Διαγραφή Διαδρομών&lt;/a&gt;
  
                  &lt;/li&gt;
                  &lt;li ng-class="{active: collapseVar==1}" ng-cloak ng-show="devicesLoaded &amp;&amp; currentUser"&gt;{{dropDown}} &lt;a href="" ng-click="check(1)"&gt;&lt;i class="fa fa-car fa-fw"&gt;&lt;/i&gt; Συσκευές&lt;span ng-show=DevicesArray
                                                                                               class="fa arrow"&gt;&lt;/span&gt;&lt;/a&gt;
  
                      &lt;ul id="deviceDataList" class="nav nav-second-level" collapse="collapseVar!=1"&gt;
                          &lt;li ng-show=devicesLoaded class="sidebar-search"&gt;
                              &lt;div class="input-group custom-search-form"&gt;
                                  &lt;input type="text" class="form-control" ng-model="searchText" placeholder="Αναζήτηση..."&gt; &lt;span class="input-group-btn"&gt;
                                  &lt;!--&lt;button class="btn btn-primary dropdown" type="button"&gt;&lt;/button&gt; --&gt;
                                  &lt;div class="dropdown"&gt;
                                      &lt;a id="toolsDrop" href="" role="button"
                                         class="dropdown-toggle btn btn-primary"
                                         data-toggle="dropdown"
                                         style="padding: 6px 6px 6px 8px;"&gt;Φίλτρα&amp;nbsp;&amp;nbsp;&amp;nbsp;&lt;b
                                              class="caret"&gt;&lt;/b&gt;&lt;/a&gt;
                                      &lt;ul class="dropdown-menu" style="min-width: 0; top: 34px; left: -20px;"&gt;
                                          &lt;li&gt;
                                              &lt;a href="" style="padding: 6px; min-width: 0"
                                                 ng-click="statusFilter = movingFilter"&gt; &lt;img
                                                      src="misc/images/pinOntheMove.png"&gt;&amp;nbsp;Κινείται&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;&lt;a href="" style="padding: 6px;min-width: 0"
                                                 ng-click="statusFilter = stoppedFilter"&gt; &lt;img
                                                  src="misc/images/pinStopped.png"&gt;&amp;nbsp;Σε Στάση&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li&gt;&lt;a href="" style="padding: 6px;min-width: 0"
                                                 ng-click="statusFilter = unknownFilter"&gt; &lt;img
                                                  src="misc/images/pinUnknown.png"&gt;&amp;nbsp;Άγνωστο&lt;/a&gt;
                                          &lt;/li&gt;
                                          &lt;li class="divider hidden-xs"&gt;&lt;/li&gt;
                                          &lt;li&gt;&lt;a href="" style="padding: 6px;min-width: 0"
                                                 ng-click="statusFilter = allFilter"&gt; &lt;i class="fa fa-th-list"&gt;&lt;/i&gt;&amp;nbsp;Όλα&lt;/a&gt;
                                          &lt;/li&gt;
                                      &lt;/ul&gt;
                                  &lt;/div&gt;
                                  &lt;/span&gt;
  
                              &lt;/div&gt;
                          &lt;/li&gt;
                          &lt;li&gt;
                              &lt;ul class="nav nav-second-level sidebar-device-list"&gt;
                                  &lt;li ng-init="third=!third" ng-class="{active: multiCollapseVar==3}" ng-repeat="device in DevicesArray | filter:dataFilter | filter:searchText | filter: statusFilter" id="{{device.DeviceId}}" lat="{{device.DeviceData.Position.Y}}" lng="{{device.DeviceData.Position.X}}" ui-sref-active="active"&gt; &lt;a style="font-weight:bold; border-style: none none solid none;" href="" ng-click="CenterMapOnPosition(device.DeviceData.Position, device.DeviceData.DeviceId)"&gt;&lt;img
                                          width="26"
                                          height="26"
                                          ng-src="misc/images/pin{{device.DeviceData.State}}.png"&gt;
                                      {{device.Name}} &lt;p style="font-weight: normal; color: #002a80"&gt;{{device.DeviceData.Location}}&lt;/p&gt;&lt;/a&gt;
  
                                  &lt;/li&gt;
                              &lt;/ul&gt;
                          &lt;/li&gt;
                      &lt;/ul&gt;
                      &lt;li ng-show="devicesLoaded &amp;&amp; currentUser" ui-sref-active="active"&gt; &lt;a href="" ng-click='togglePlates()'&gt;&lt;i ng-show="labelsShown" class="fa fa-check-square-o fa-fw"&gt;&lt;/i&gt;&lt;i ng-hide="labelsShown" class="fa fa-square-o fa-fw"&gt;&lt;/i&gt;&amp;nbsp;Ονόματα Οχημάτων&lt;/a&gt;
  
                      &lt;/li&gt;
                      &lt;li ng-show=currentUser ui-sref-active="active"&gt; &lt;a href="" ng-click='logout()'&gt;&lt;i class="fa fa-sign-out fa-fw"&gt;&lt;/i&gt;&amp;nbsp;Αποσύνδεση&lt;/a&gt;
  
                      &lt;/li&gt;
          &lt;/ul&gt;
      &lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>The dropdown menu is at line 32.</p>