HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>margin - 개별 속성</title>
<link rel="stylesheet" href="css/04_margin_property.css">
</head>
<body>
<center><h1>margin 개별 속성</h1></center>
<div class="container">
<section></section>
<section></section>
<section></section>
<section></section>
</div>
</body>
</html>
HTML
복사
CSS
.container {
position: relative;
width: 1200px;
border: 3px dashed orange;
margin: auto;
}
section {
margin-top: 20px; /* mt20 ⬆ */
margin-right: 40px; /* mr40 ➡ */
margin-bottom: 80px; /* mb80 ⬇ */
margin-left: 160px; /* ml160 ⬅ */
width: 200px; /* w200 ↔ */
height: 200px; /* h200 ↕ */
display: inline-block; /* dib 🍗 */
border: 3px solid gray; /* border 🟩 */
}
CSS
복사