位置绝对和底部在IE9中不起作用

Question

<div class="container" style="position: relative">
    <div id="footer" style="position: absolute; bottom: 25px; margin-top: 10px; left: 0px">
    </div>
</div>

我需要将页脚对齐到页面底部的容器下方。我不需要固定的页脚。所以我在这里使用绝对位置。 这在IE9以外的所有浏览器中都能正常工作。我也试过了position: relative。 IE9中没有任何变化。

https://jsfiddle.net/13grvhyt/

我怎样才能做到这一点？

Answer 1

＆＃13;

＆＃13;

.container{
position: relative;
  width:100%;
  height:200px;
  background-color:red;
  text-align:center;
}

.container h1{
color:white;
}

.footer{
position: absolute; 

  left: 0px
  height:50px;
  width:100%;
  background-color:black;
  text-align:center;
}
.footer h1{
 font-size:22px;
  color:white;
  
}

＆＃13;

<div class="container" >
  <h1>I am Container <h1>
    
    </div>
<div class="footer" > <h1> I am Footer</h1>
     </div>

＆＃13;

＆＃13;

＆＃13;