CSS 레이아웃 속성

flex 속성

display: flex flexbox 컨테이너로 설정하여 유연한 요소 배치와 정렬이 가능

float 속성

float: left 요소를 왼쪽으로 뛰움
float: right 요소를 오른쪽으로 뛰움
float: none 요소를 뛰우지 않고 기본값으로 설정
float: inherit 부모 요소로부터 속성 값을 상속

postion 속성

postion: static position 속성의 기본값
postion: absolute 요소를 문서의 일반적인 흐름에서 제거, 가장 가까운 상대 위치 지정 요소에 대해 위치를 결정
postion: relative 일반적인 문서 흐름에 따라 배치, 다른 위치 지정 속성과 함께 사용될 때 해당 요소의 위치가 상대적으로 조정
postion: fixed 요소를 뷰포트에 상대적으로 고정, 스크롤을 내려도 화면의 특정 위치에 고정

inline-block 속성

display: inline-block CSS에서 요소의 렌더링 방식을 설정하는 데 사용

• 인라인 레벨 요소처럼 다른 요소들과 함께 한 줄에 표시
• 블록 레벨 요소처럼 너비와 높이를 설정가능
• 여백(margin)과 패딩(padding)이 설정가능

grid 속성

... ...