relative - govl2233/project_studyej GitHub Wiki
1.๋ถ๋ชจ์์๊ฐ๋๋๊ฑด์๋๋๊น ์ฐฉ๊ฐํ์ง๋ง๊ธฐ.
2.๊ฒน์ณ๋ ์๊ด์์. ์ค์ ์์น๋ ์ฒ์์ ์์ ์ด์๋ ์์น์ด์ง๋ง ์๋์น๋ฅผ ์ฃผ๋ฉด์ ์ ์ฒด์ดํ์ ํ ์ ์์ผ๋ฉฐ ๋ค๋ฅธ ์์์ ๊ฒน์น ์๊ฐ ์๋ค.
3.๋ถ๋ชจ์์์ absolute๋ก marin 0 ์ ์ฃผ๋ฉด ์๋จนํ์ relative๋ก ์ค์ผํจ.
ex)
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>relative</title>
<style type="text/css">
*{margin: 0; padding: 0;}
.box1{border:1px #f00 solid;
width:200px;
height:200px;
position:relative;
left:100px;
top:10px;
}
.box2{border:1px #f0f solid;
width: 200px;
height: 200px;
position: relative;
left:310px;
bottom:190px;
}
</style>
</head>
<body>
<div class="box1">1</div>
<div class="box2">2</div>
</body>
</html>