Styling (css) my Webmap

[AntonAntonenko]

Hey Esri,

I'm finalizing my project right now and decided to add some styling (css) to it before I ship it. I'm looking to have the screen split in two, one side is the webmap and on the other side a drop down menu with the submit button (I dont think it should be to complicated).

The only issue is, every time I give a z-index or put any float property to the drop down menu, the map blacks out.

(as you can see the drop down menu moved up.

 in this example i also gave the webmap the following styling:

  #map_div {
    position: absolute;
    padding: 0;
    margin: 0;
    height: 100%;
    max-width: 50%;
    z-index: -1;
  }‍‍‍‍‍‍‍‍

 I don't know if I'm doing something wrong or Esri did it on purpose.

Please let me know if you have any leads on the issue, i'll appreciate any help. 

Thank you,

Anton.