2011-04-07 2 views
1

나는 다음과 같은 코드는 응용 프로그램에 하드 코딩 670없이 작동하도록하기 위해 노력하고있는 비 PX 높이로 자동 :오버 플로우 사용 방법 : IE7

 <tr> 
      <td height="100%"> 
       <div id="navigation" class="navigation"> 
        <jsp:include page="menu.jsp" flush="true"/> 
       </div> 
      </td> 
      <td> 
       <div style="height:670px; overflow: auto; width:100%;"> 
        <jsp:include page='dynamicContent.jsp' flush="true"/> 
       </div> 
       <div> 
        <center><jsp:include page="footer.jsp" flush="true" /></center> 
       </div> 
      </td> 
     </tr> 

이 창 전에 IE7에서 잘 렌더링 resize - 내용 창은 페이지 바닥 위의 고정 높이에서 바닥 글과 함께 스크롤합니다.

그러나 오버플로 : 숨김을 사용하도록 설정된 페이지의 HTML이 있으므로 창을 작게 만들 때이 작업이 중지됩니다 (분명한 이유로).

"height : 75 %"를 사용하면 IE7에서 오버플로와 호환되지 않는 것 같습니다.

아무도 내가 IE7 (프로젝트 요구 사항의 IE7 원인과 호환되어야 함)이 어떻게 위장할지 모르는 의견이 있습니까? 불행하게도이 코드는 꽤 임베디드되어 있으므로 테이블 대신 CSS 위치 지정을 사용하면 다음 릴리스 전에 처리 할 수있는 것보다 더 많은 작업을 수행 할 수 있습니다.

+6

당신이 문제의 예와 함께 우리에게 [jsfiddle] (http://jsfiddle.net) 줄 수 : 여기

는 작업 라이브 예입니다? 이 코드만으로는 크기를 조정할 때 오류가 나타나지 않습니다. – Khez

+0

그런 식으로 구현하려는 경우 - 테이블을 제거해야합니다. –

답변

1

overlow: auto, overlow: hidden 및 고정 높이를 제거하십시오. 대신 바닥 글에 고정 된 위치를 지정하고 바닥 글의 높이에 바디의 여백을 추가하십시오.

body 
{ 
    margin-bottom: 100px; 
} 
.footer 
{ 
    position: fixed; 
    bottom: 0; 
    height: 90px; 
    padding-top: 10px; 
    background-color: #fff; 
} 

바닥 글의 배경을 설정해야합니다. 그렇지 않으면 페이지 콘텐츠가 표시 될 수 있습니다. http://jsfiddle.net/ADpMs/