title: "z-index" on Bootstrap navbar and dropdown
body: <p>I have a problem in my navbar dropdown and cart dropdown.</p>
  
  <p>I'm not sure how to fix this (I don't have solid knowledge about css <code>z-index</code>).</p>
  
  <p>What I want is the shopping cart menu dropdown to stay on top of <code>navbar</code> menu dropdown.</p>
  
  <p>I have changed the <code>z-index</code> on both dropdown menus and doesn`t work.<br>
  Thanks.</p>
  
  <p>Here is the image:
  <a href="https://i.stack.imgur.com/sOphf.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/sOphf.png" alt="Shopping Cart Screenshot"></a></p>
  
  <p>Here is the working jsfiddle:<br>
  <a href="https://jsfiddle.net/nmdh5vmv/2/" rel="nofollow noreferrer">https://jsfiddle.net/nmdh5vmv/2/</a></p>