#wrap{
overflow:hidden;
position:relative;
width:1000px;
margin:0 auto;
border:1px solid black;
}
#left_area{
position:absolute;
top:0px;
left:0px;
bottom:0px;
width:200px;
color:#FFFFFF;
background:black;
}
#content{
float:right;
display:block;
width:750px;
min-height:300px;
}
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<?php require_once($_SERVER['DOCUMENT_ROOT'].'/siteTitle.php'); ?>
<link rel="stylesheet" href="/css/reset.css" />
<link rel="stylesheet" href="prc_css.css" />
</head>
<body>
<!--[if lt IE 9]><script src="//html5shiv.googlecode.com/svn/trunk/html5.js"></script><![endif]-->
<div id="wrap">
<div id="left_area">
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
왼쪽영역<br />
</div>
<div id="content">컨텐츠영역</div>
</div>
</body>
</html>
원글: http://hompylove.com/system/bbs/board.php?bo_table=tip&wr_id=25
'기존카테고리 > CSS' 카테고리의 다른 글
체크박스1 (0) | 2018.03.15 |
---|---|
float 아래 콘텐츠 안밀려올라가기 (0) | 2018.03.10 |
Div 간격이 있을 경우 font-size:0; 를 준다. (0) | 2018.02.01 |
border 사이즈 합치기 (0) | 2018.02.01 |
CSS 정리 (1) | 2017.10.24 |