여기에 하나의 html 양식과 하나의 CSS 파일(style.css)이 있습니다. "o-div"는 외부 div이고 "i-div"는 내부 div 클래스입니다.
예시
<html > <head> <title>center a div</title> <link href="../../Content/style.css" rel="stylesheet" type="text/css" /> </head> <body> <div class="o-div"> I am OUTER DIV <div class="i-div"> I am INNER DIV, I am in Center </div> </div> </body> </html>
출력
I am OUTER DIV I am INNER DIV, I am in Center
스타일.css
body {
background-color:Gray;
padding:30px;
}
.o-div {
padding:50px;
background-color:Lime;
}
.i-div {
background-color:Fuchsia;
max-width:400px;
height:200px;
margin: 0 auto;
text-align:center;
}