맨위로
믹시

[웹표준]div로 100%높이를 유지하는 레이아웃

HTML/CSS 조회 수 12871 추천 수 0 2006.03.09 12:28:54
3gridVertical.gif

<!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="refresh" content="3" />
<meta http-equiv="Content-Type" content="text/html; charset=euc-kr" />
<title>Full height layout</title>
<style type="text/css">
<!--
html,
body {
        height:100%;
        margin:0;
        padding:0;
}
#bd{
        margin:0 auto;
        height:100%;
        width:500px;
        background:#ccc;
}
#head{
        height:100px;
        width:500px;
        background:#ddd;          
        position:relative;
        z-index: 1;
}        
#center {
        min-height:100%;
        width:500px;
        margin:-100px 0 -50px;
        background-color:#eee;
}
#content-area{
        padding:100px 0 50px;
}
#foot{
        height:50px;
        width:500px;
        background-color:#ddd;
}
-->
</style>
<!--[if IE]>
<style type="text/css">
#center {
height: 100%;
}
</style>
<![endif]-->
</head>
<body>
<div id="bd">
  <div id="head"> 높이 100 pixel </div>
  <div id="center">
    <div id="content-area"> 내용<br />
    </div>
  </div>
  <div id="foot"> 높이 50 pixel </div>
</div>
</body>
</html>


익스플로어6 , 파이어폭스1.5.1  테스트완료

쉽지 않아~!~!~!   적응이 돼려나....
List of Articles
번호 제목 글쓴이 날짜 조회 수 최근 수정일
공지 Windows 웹개발관련 팁,소스등을 모아놓은곳입니다. file id: 김선생 2006-03-09 86382 2011-02-01 23:57

HTML/CSS 모든링크 한번에 점선없애기

a { selector-dummy : expression(this.hideFocus=true);} css파일에 이 한줄만 넣으면 해결 됩니다.

  • id: 김기현
  • 2006-07-24
  • 조회 수 7987
  • 2008-04-11 09:52

Photo Canon PictureStyle 캐논픽쳐스타일 file

5D 30D 1DmarkIIN 등의 픽쳐스타일

  • id: 김기현
  • 2006-07-08
  • 조회 수 7363
  • 2006-07-08 01:09

Actionscript Flv파일을 서버에 업로드하였을때 보이지 않을 경우

한국매크로미디어(대표 이원진 www.macromedia.com/kr)는 특별한 비디오 전문지식 없이도 원하는 영상을 웹에 손쉽게 삽입할 수 있도록 지원하는 '플래시 비디오 키트(Flash Video Kit)'를 출시했다고 합니다. 이는 Studio MX 2004 ...

  • id: 김기현
  • 2006-05-26
  • 조회 수 7216
  • 2006-05-26 15:12

Windows .PSD(포토샵파일) & .AI파일(일러스트 파일 미리보기 안될때 패치 CS, CS2버젼 file

포토샵과 일러스트레이터 CS, CS2버젼에서는 탐색기에서 PSD파일(포토샵 파일)과 AI파일(일러스트 파일)의미리보기기능을 지원하지 않습니다. 본 패치를 실행하시면 해결 하실 수 있습니다. 아 ~! 속이 다 시원하네요.~!

  • id: 김기현
  • 2006-05-18
  • 조회 수 10147
  • 2008-04-11 09:52

Windows ActiveX 변경 사용자패치

http://www.microsoft.com/downloads/details.aspx?FamilyID=b7d9801b-4fb5-492e-903e-3400abf1d731&DisplayLang=ko 임시패치라네.

  • id: 김기현
  • 2006-05-09
  • 조회 수 5392
  • 2006-05-09 11:47

HTML/CSS CSS 를 이용한 테이블(Table)코딩 셀 넓이 조정 방법

<!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; charse...

  • id: 김기현
  • 2006-03-09
  • 조회 수 10962
  • 2008-04-11 09:54

HTML/CSS [웹표준]div로 100%높이를 유지하는 레이아웃 file

<!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="refresh" content="3" /> <meta http-equi...

  • id: 김기현
  • 2006-03-09
  • 조회 수 12871
  • 2009-12-25 13:17

Javascript E6 Active X 설계변경에 대한 플래쉬코딩방법 file

===================================== JS 파일 내용 ===================================== function flashWrite(url,w,h,id,bg,vars,win){ var flashStr= "<object classid='clsid:d27cdb6e-ae6d-11cf-96b8-44455354...

  • id: 김기현
  • 2006-03-02
  • 조회 수 6397
  • 2006-03-02 17:13

HTML/CSS Div 태그로 레이아웃 잡기 (연습) file

<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=shift_jis" /> <title>Div Layout Exm</title> <style type="text/css"> body{ background:black; padding:0px; height:100%; width:100%; text-align:ce...

  • id: 김기현
  • 2006-02-27
  • 조회 수 18049
  • 2008-04-11 09:54

Actionscript 마우스커서모양변경팁

Mouse.hide(); //기본커서모양을 감춘다 this.onMouseMove = function() { //this무비클립을 마우스포인터에 따라오게 한다 this._x = _root._xmouse; this._y = _root._ymouse; updateAfterEvent(); // FPS에 상관없이 액션을반복한...

  • id: 김기현
  • 2006-01-09
  • 조회 수 8936
  • 2008-04-04 11:52