본문 바로가기
HTML,CSS,JS

css) position 속성

by cdbitmana 2020. 11. 28.

position:absolute인 엘리먼트는 top,bottom,left,right로 위치를 정한다.

 

 

position에 absolute 키워드를 적용하면 부모 태그가 영역을 차지하지 않게 된다.

(absolute속성인 자식엘리먼트는 부모 밖으로 나오는 셈)

 

이를 해결하기 위해서,

 

자손의 position 속성에 absolute 키워드를 적용하면 부모는 height 속성을 사용한다.

 

 

 

 

position에 absolute 키워드를 적용하면 자식 키워드가 부모를 기준으로 위치를 잡지 않게 된다.

 

이를 해결하기 위해서,

 

자손의 position 속성에 absolute 키워드를 적용하면 부모의 position 속성에 relative 키워드를 적용한다.

(부모가 relative이면 absolute인 자손은 부모를 기준으로 top,bottom,left,right 위치가 정해진다.)

'HTML,CSS,JS' 카테고리의 다른 글

css) display:flex 속성 참고 블로그  (0) 2020.12.09
HTML,CSS) z-index  (0) 2020.12.04
css) first-child, last-child, nth-child  (0) 2020.11.28
css) 기본 속성이 inherit인 것과 아닌 것  (0) 2020.11.27
css) box-sizing 속성  (0) 2020.11.26