title: set z-index to a layer control in leaflet
body: <p>I have a leaflet map and a fullscreen button. When I push the fullscreen button, I show a custom div which overlays the map. The problem is that my div hides the control layer menu. How could I show the menu in a way that hides my div?</p>
  
  <p>My div has the minimum z-index to be shown in front of the map. Ideally I would like to give a higher z-index value to the menu.</p>
  
  <p>I have created a codepen example. Switch to fullscreen to understand what I'm saying.</p>
  
  <pre><code>var map = L.map('map', {
          center: [39.73, -104.99],
          zoom: 10,
          layers: [grayscale, cities],
          fullscreenControl: true
      });
  
      var baseLayers = {
          "Grayscale": grayscale,
          "Streets": streets
      };
  
      var overlays = {
          "Cities": cities,
          "quite": quite,
          "long": long,
          "list": list,
          "of": of,
          "options": options,
          "at": at,
          "the": the,
          "list": list,
          "and": and,
          "some":some,
          "few": few,
          "more":more
      };
  
      L.control.layers(baseLayers, overlays).addTo(map);
  </code></pre>
  
  <p><a href="http://codepen.io/corand/pen/wGyJOZ" rel="nofollow">http://codepen.io/corand/pen/wGyJOZ</a></p>