title: Div Resize not working on Internet explorer
body: <p>I have a div that I'm resizing through simple css that resizes beautifully on chrome , firefox , and some other browsers however it doesn't seem to do anything on internet explorer. I have put my code below to have a look at it as I'm not sure what I'm missing. I'd prefer if possible to keep the solution within css but if I need to implement something else I am open to options and any help. Thank you.</p>
  
  <pre><code>&lt;!DOCTYPE HTML&gt;
  &lt;html&gt;
     &lt;head&gt;
        &lt;meta http-equiv="Content-Type" content="text/html; charset=windows-1252"&gt;
        &lt;meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"&gt;
        &lt;meta http-equiv="Pragma" content="no-cache"&gt;
        &lt;meta name="viewport" content="initial-scale=1.0, maximum-scale=1.0, user-scalable=yes, width=device-width"&gt;
        &lt;meta name="HandheldFriendly" content="true"&gt;
        &lt;meta name="MobileOptimized" content="width"&gt;
        &lt;style type="text/css"&gt;
           * { margin: 0; padding: 0; }
           html, body { width: 100%; height: 100%; overflow: hidden; color: #ffffff; background-color: #000000; }
           #banner { width: 100%; height: 100%; border: none; overflow: hidden; float:left; z-index:9; }
           #BodyContainer { position: absolute; top: 150px; left: 0px; bottom: 0px; right: 0px; clear: both; }
           #bottom { width: 100%; height: 100%; border: none; }
           .resizable {
           resize: vertical;
           display: block;
           width: 100%;
           height: 120px;
           border: 2px black;
           overflow: hidden;
           position: relative;
           box-shadow: 1px 1px 1px #33A6A6;
           z-index:9;
           }
        &lt;/style&gt;
     &lt;/head&gt;
     &lt;body&gt;
        &lt;div&gt;&lt;/div&gt;
        &lt;div class="resizable"&gt;
           &lt;iframe width="100%" height="100%" id="banner" name="BANNER" src="$BASE$/BANNER?$CONFIG$"&gt;&lt;/iframe&gt;
        &lt;/div&gt;
        &lt;div&gt;&lt;/div&gt;
        &lt;div id="BodyContainer"&gt;
           &lt;div&gt;&lt;/div&gt;
           &lt;iframe width="100%" height="100%" id="bottom" name="BODY" src="$BASE$/BODY?$CONFIG$"&gt;&lt;/iframe&gt;
        &lt;/div&gt;
     &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>