<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>Height 100%</title>
<style type="text/css">
html,
body {
height: 100%;
margin: 0;
padding: 0;
}
#head {
height: 100px;
background: #ddd;
position: relative;
z-index: 1;
}
#body {
min-height: 100%;
margin: -100px 0 -50px;
border:0px solid #CC0033;
}
* html #body {
height: 100%;
}
#content-area {
padding: 100px 0 50px;
border:0px solid red;
}
#foot {
height: 50px;
background: #ddd;
border:0px solid blue;
}
</style>
</head>
<body>
<div id="head">
요건 100px 높이 헤드
</div>
<div id="body">
<div id="content-area">
<p>컨텐츠 영역 1</p>
<p>컨텐츠 영역 2</p>
<p>컨텐츠 영역 3</p>
<p>(계속 추가해서 테스트 가능)</p>
</div>
</div>
<div id="foot">
요건 50px 높이 풋
</div>
</body>
</html>
'html' 카테고리의 다른 글
| html 가이드 (0) | 2017.02.01 |
|---|---|
| alt, title, longdesc 정의 (0) | 2017.02.01 |
| 카렌다 (0) | 2017.02.01 |
| 테이블에 스크롤바 생성하기 (0) | 2017.02.01 |
| 특수문자 (0) | 2017.02.01 |