더북(TheBook)

2차원과 3차원의 세계, relative 속성값

relative 속성값은 2차원과 3차원의 특징을 모두 갖습니다. 부모 자식 간에 발생하는 마진 병합 현상이 일어나고, top·right·bottom·left 속성이 적용되며, 부모가 높이를 갖고 있지 않으면 자식의 높이가 부모에게 영향을 줍니다.

#position_relative_child 안에 margin-top 속성을 사용하면 static 속성값과 마찬가지로 부모 자식 간에 발생하는 마진 병합 현상이 일어납니다.

예제 소스 Exercise/8장/2_position/3_relative.html

<div id="box1"></div>
<div id="position_relative_parent">
    <div id="position_relative_child"></div>
</div>
신간 소식 구독하기
뉴스레터에 가입하시고 이메일로 신간 소식을 받아 보세요.