세로정렬1 CSS display flex 간단하게 박스 정렬 하기 html,css 코딩에서 그리드 정렬에는 여러가지 방법이 있지만 저는 display : flex 속성을 상당히 자주 쓰고 있습니다. flex를 모를 때는 float 이나 display : table 등으로 세로 정렬이나 가로 정렬등을 했었지만 flex 속성으로 쉽게 정렬 가능합니다. flex관련 속성은 정말 여러가지가 있지만 여기서는 기본적인 정렬을 위한 것만 사용하겠습니다. 테스트용으로 적당히 작성한 코드입니다. 컨테이너 박스가 있고 그 안에 각각 가로값과 세로값이 다른 박스 아이템이 있습니다. 위의 상태 그대로 라면 div의 기본속성은 display block이기 때문에 가로값과 관계없이 세로영역 만큼 한줄을 다 차지하기 때문에 div박스들은 아래와 같이 수직으로 떨어지게 됩니다. 여기서 float:.. 2020. 9. 17. 이전 1 다음
