div 내의 div를 중앙에 정렬하려면 (CSS)

2

어떤 글에서 박스를 가운데에 정렬되게 하고 싶은 경우가 많을 것입니다. div는 align 속성을 가지고 제어가 잘 되지 않습니다. 이런 경우 다음과 같이 두 개의 div를 중첩하여 사용하여 쉽게 중앙에 정렬되게 할수 있습니다. 다음과 같은 css 코드를 사용하면 됩니다.

#out {
 width: 100%;
 text-align: center;
 }
#in {
 display: inline-block;
 }

가령 html 코드가 다음과 같을 경우에,

<div class="out">
    <div class="in">
        
    <div>
    
</div>

다음 그림과 같이 css를 적용하면 안쪽의 div가 중앙에 정렬되어 있음을 알 수 있습니다.

Div 내의 div를 가운데 정렬하기

참고:

*일부 글에 제휴링크가 포함될 수 있습니다.기부를 통해 블로그 운영을 후원하실 수 있습니다.

Related Posts

2개 댓글
  1. wordcracker

    다른 방법:

    #outer {
    position: relative;
    }

    #inner {
    margin: auto;
    position: absolute;
    left:0;
    right: 0;
    top: 0;
    bottom: 0;
    }

    http://stackoverflow.com/questions/114543/horizontally-center-a-div-in-a-div

댓글 남기기