CSS 포지션 속성 : absolute , fixed, realtive

간단히 정의를 보면

• absolute : left, top, right, bottom 값으로 전 화면을 아무런 제약 없이 쓸 수 있는 것
• relative : absolute를 쓸 때 영역을 잡아주는 역할
• fixed :  부모로 부터 독립되어 어느 것이든 사용이 가능하고 그 자리에 고정된다

다시 말해 absolute 는 자식 realtive는 부모라고 생각하면 된다.

absolute는 아직 어려 이리저리 돌아다는 것을 좋아하고 realtive는 그런 아이의 공간을 제한 한다고 생각하면 된다.

 

 

fiex는 상단 메뉴바와 같이 고정으로 사용하고 할 때 자주 사용 된다.

 

 

- relative  문제점

영역을 제한해주는 것은 좋지만 모달창 구현 시 뒷 배경을 검게 칠했을 때 배경색이 적용되지 않는 문제점이 있다.

따라서 모달 사용시에는 relative를 사용하지 말자.