position 그 자리에 고정시킴.
position: absolute; 순수한. 주위 관계없이 거기에 딱
float처럼 문서 흐름에서 띄어짐.
하면 body? 화면? 이 기준으로 움직임.
근데 부모가 position: relative 면 그거 기준임. 그래서 보통 relative랑 같이 씀
근데 부모가 relative라도 float처럼 자기 자식에서는 빠짐
top, bottom, left, right 외에 margin같은건 그래도 부모기준인듯.
absolute 주는 순간 margin 같은 거 안 먹음.
position: relative 상대적인
하면 부모 기준으로 움직임.
그리고 이거는 문서 흐름에도 기존에 있던 자리는 잡아줌.
레이어처럼 숫자 높을수록 위에 위치함. position 쓴거에만 적용됨.
참고로 상자 top, bottom, left, right가 부모, 혹은 absolute 같은 경우는 body 기준으로 움직이는데,
양수면 부모 안쪽, 음수로 주면 부모 바깥으로 이동함.
position이랑 float 같이 못씀
top, bottom, left, right 이런 거 쓸려면 position 해줘야 함. css도 js도
참고로 애니메이션 등 이동 시키기 위해서는 position 필요!
top, bottom, left, right 준 후에는 margin을 쓸 수 있는 듯? 아니면 부모가 relative 처럼 기준이 있으면.
top, 쓰면 top의 기준이 생기고, bottom을 쓰면 bottom 기준이 생기는 듯?
그거 두개 다 0 준 다음 margin auto 해야 정렬 가능