将两个div设置为不重叠

Question

我无法弄清楚如何设置包含Google地图地图的div和包含菜单的另一个div。 我想显示两个div内联并将地图设置为根据屏幕分辨率自动调整。

#map {
height: 100%!important;
width: 100%;
position: fixed!important;
display: inline-block!important;
float: right;
min-height: 100%;
}
#admin-panel{
 background-color:#212121;
 color:#8c8c8c;
 height: 100%!important;
 position: fixed;
 display: inline-block;
 z-index: 1;
 }


         <script>
            var map; //<-- This is now available to both event listeners and the              initialize() function
                function initialize() {
                  var mapOptions = {
                   center: new google.maps.LatLng(-23.460347, -45.089335),
                   zoom: 12,
                   mapTypeId: google.maps.MapTypeId.ROADMAP
                  };
                  map = new google.maps.Map(document.getElementById("map"),
                            mapOptions, {size:"100%"});
                }
                google.maps.event.addDomListener(window, 'load', initialize);
                google.maps.event.addDomListener(window, "resize", function() {
                 var center = map.getCenter();
                 google.maps.event.trigger(map, "resize");
                 map.setCenter(center); 

                });
        </script>
        <script src="https://maps.googleapis.com/maps/api/js?     callback=initialize"
            async defer>
        </script>

谢谢你的帮助！