inline, inline-block 수준의 요소에 대한 가로 정렬

상위 요소가 가로 크기를 가질 수 있는 요소일 때 text-align 속성을 이용해 가로 정렬을 처리한다. 텍스트 역시 inline으로 처리되므로 정렬의 대상이 된다.

block 수준의 요소에 대한 가로 정렬

block 수준의 요소는 기본 값으로 상위 요소의 콘텐츠 영역 왼쪽에 맞춰 크기를 가지게 된다.

부모 block 요소의 가운데 위치 시키고자 할 경우에는 좌우 margin 속성의 값을 auto로 설정한다.

부모 요소의 가로 크기보다 작다면 남는 공간이 발생하며 'auto'로 지정시 웹브라우저가 자동으로 남은 공간을 균등하게 좌우에 배분하여 간격을 설정한다. 따라서 요소는 부모 요소내의 가로 방향으로 가운데 오게 된다.

block 수준의 요소를 직접적으로 오른쪽으로 위치시키는 방법은 없다.

간접적으로 float 속성의 값을 right로 설정하거나 position 속성으로 이용해서 처리해야 한다.