수다닷컴

100% 레이아웃에서 콘텐츠 테이블 높이를 맞추려면요?

늘찬 2025.03.27 댓글 4

전체를 100% 높이로 설정한 레이아웃에서 콘텐츠 영역 안에 높이 100%인 테이블을 넣고 싶습니다.
그런데 테이블 높이를 100%로 주면 위쪽 영역 높이만큼 스크롤이 생기네요.
마이너스 마진이나 절대 위치를 써도 공간이 남습니다.
이 문제를 자바스크립트로 해결해야 할까요?

댓글 4

  • 다스리 2025.03.27

    저도 비슷한 문제로 고생했어요.
    `<!--[if IE]>` 조건부 코드는 IE에서만 적용된다고 합니다. 해킹 기법 없이 적용할 수는 있지만, 테이블을 100%로 두면 화면을 넘어가더라고요.

  • 도전중 2025.03.27

    그럼 콘텐츠 영역 안에 높이 100%인 테이블을 넣는 건 어려운 건가요?

  • 여우By 2025.03.27

    100% 레이아웃은 말씀하신 것처럼 수정해보세요.
    테이블에는 `height="100%"` 속성을 적용하기 어렵습니다.

  • 일진누나 2025.03.27

    아래처럼 구성해볼 수 있습니다.

    ```css
    html, body {
    height: 100%;
    margin: 0;
    padding: 0;
    }
    #head {
    height: 100px;
    background: #ddd;
    position: relative;
    z-index: 1;
    }
    #body {
    min-height: 100%;
    _height: 100%;
    margin: -100px 0 -50px;
    }
    #content-area {
    padding: 100px 0 50px;
    }
    #foot {
    height: 50px;
    background: #ddd;
    }
    ```