100%레이아웃에서 content부분 테이블 height를 100%로 했을때...
초록이
전체 100% 레이아웃에서 가운데 컨텐츠부분에 높이 100%인 테이블을 넣을려고 하는데..
100% height의 테이블을 넣으니 top부분의 높이만큼 스크롤이 생기네요..
컨텐츠 부분 height 100%랑 상단 top의 높이를 같이 계산해서 브라우저 크기를 잡는듯한데..
마진값을 -값을 이용해서 하니 컨텐츠 부분이 올라가고 절대위치를 줘도 그 위치값만큼 공간을 인식하네요..
게시판 글을 찾아봐도 답이 없고...
이부분을 스크립트로 해결하는 수 밖에 없는지.........
!doctype html public -//w3c//dtd xhtml 1.0 strict//en
http://www.w3.org/tr/xhtml1/dtd/xhtml1-strict.dtd
html xmlns=http://www.w3.org/1999/xhtml
head
meta http-equiv=content-type content=text/html; charset=utf-8 /
titleuntitled document/title
style type=text/css
html, body {
height: 100%;
margin: 0;
padding: 0;
}
#head {
height: 100px;
background: #ddd;
position: relative;
z-index: 1;
}
#body {
height: 100%;
min-height: 100%;
margin: -100px 0 -50px;
}
* html #body {
height: 100%;
}
#content-area {
height: 100%;
padding: 100px 0 50px;
}
#foot {
height: 50px;
background: #ddd;
}
/style
/head
body
div id=head 요건 100px 높이 헤드 /div
div id=body
div id=content-area
table width=100% border=1 height=100%
tr
td bgcolor=#00ffff /td
td /td
td /td
td /td
td /td
td /td
td /td
/tr
tr
td /td
td /td
td /td
td /td
td /td
td /td
td /td
/tr
tr
td /td
td /td
td /td
td /td
td /td
td /td
td /td
/tr
/table
/div
/div
div id=foot 요건 50px 높이 풋 /div
/body
/html
-
일본녀 2025-03-27
table 태그에 height 속성은 자제해야하며 Strict 에서는 불가입니다.
css 의 height 속성을 이용하면 되지만
위의 100% 레이아웃 구조상 편법을 써도 IE6 에서는 적용이 되지 않습니다.
자바스크립트로 창크기에 따라 table 의 height 스타일을 자동조절하는 방법을 권해드립니다. -
향율 2025-03-27
저도 위와 같은 경우 때문에 고생하고 있는데 비슷한 경우라 올립니다.
아래에 있는 !--[if IE]라는 기능은 IE에서만 적용된다고 합니다.
hack를 사용하지 않고 적용시킬수 있다네요..
문제는 테이블을 100%로 주면 화면에서 넘어간다는 ㅠㅠ
!--[if IE]
style type=\text/css\
#body {
height: 100%;
margin: -100px 0 -50px;
}
#content-area {
height: 100%;
padd -
민아 2025-03-27
그럼 #content-area에 height 100%인 table은 만들 수 없단 말인가요??
-
두메꽃 2025-03-27
100% 레이아웃 하시려면 저렇게 수정하시구요.
테이블은 height=\100%\ 속성안됩니다 -
AngelsTears 2025-03-27
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 {
번호 | 제 목 | 글쓴이 | 날짜 |
---|---|---|---|
2690365 | 고수님들~ IE6,7의 버그를 잘 잡기위한 튜토리얼이나 책 추천좀 부탁드려요! (1) | Schokolade | 2025-04-04 |
2690307 | 연사자중 &에 대해 질문합니다. | 미리별 | 2025-04-03 |
2690286 | 포커스메소드.. (3) | 집1어치워 | 2025-04-03 |
2690261 | label..? (10) | 차분 | 2025-04-03 |
2690232 | Contact form 7 에서 방문자가 한글파일을 첨부해서 보내면 파일명이 깨집니다. (1) | 무들 | 2025-04-03 |
2690207 | 질문~ 산수? 문제욧.ㅋ 다시질문이욧~ (5) | 가리매 | 2025-04-02 |
2690178 | 사진 게시판 질문입니다. (1) | 빛다 | 2025-04-02 |
2690144 | 글씨속성중 %요...? (3) | 클라우드 | 2025-04-02 |
2690116 | 비베.net 과 비베와 같나요?? | 흰여울 | 2025-04-02 |
2690088 | 퍼블리셔분들 문의드려요~! | 예그리나 | 2025-04-01 |
2690033 | 기초적인 비트연산자에 관한 문제.. (3) | 초시계 | 2025-04-01 |
2690006 | td에 class값에 대해.. (7) | 계획자 | 2025-04-01 |
2689979 | [초보질문] 제발 가르쳐 줘요..생 초보 한테는 답두 안해 주남여...흑 (8) | 간조롱 | 2025-03-31 |
2689952 | [질문] 다람쥐메일같은걸(IMAP되는) 직접 깔 수 있는 웹호스팅이 있을까요? | 힘차 | 2025-03-31 |
2689932 | 텍스트 세로정렬(?) 관련질문 | 우수리 | 2025-03-31 |
2689908 | 커스텀 테마 플러그인 추천 부탁드립니다~! | 풋내 | 2025-03-31 |
2689882 | 플래시 액션스크립터의 역활은 어디까지 일가요? (10) | 민트 | 2025-03-30 |
2689849 | iframe 표준에 맞게 넣는 방법 (3) | 타마 | 2025-03-30 |
2689824 | c++에서 string.. (6) | 슬옹 | 2025-03-30 |
2689791 | 애플릿뷰어를 실행하면 아무것도 안나오네요 (1) | 너에게 | 2025-03-30 |