[CSS] 가운데정렬

2020. 4. 26. 19:25컴퓨터언어/HTML CSS

728x90
반응형
.oneParent {
    text-align: center;
}

container, body 등 부모요소가 class="oneParent" 속성을 가지면, 하위 태그들을 가운데 정렬시킴

단, 하위 태그들은 width 속성이 없는 h, a, p, 등

 

 

.itsChild {
    margin: auto;
}

위의 text-align: center;를 적용해도 안먹는 하위 태그들이 있다.

이는 하위 태그가 display: block이면서 그 width 속성을 건드린 경우에 해당한다(ex. h1 태그에 width: 10%; 적용)

이럴 때는 하위 태그에 margin을 0 또는 auto로 적용하면 된다.

 

728x90
반응형