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

.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; 
 
    
 
}

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