'CSS'에 해당되는 글 2건

FLEX 는 container 안에 items이 꼭 있어야 한다.

컨테이너와 아이템별로 속성이 있다.

Properties for the flex container

flex-direction

방향... 가로로 할건지 세로로 할건지

flex-wrap 

흘러 넘치게 할건지?

align-items

세로정렬

justify-content 

가로정렬

align-content 

아이템들을 정렬

Properties for the flex items

align-self

자기자신만을 정렬

flex-grow

숫자가 클수록 영역이 커진다

flex-shrink

숫자가 클수록 영역이 작아진다.

flex ( property for flex items )

.item { flex: flex-grow [flex-shrink] [flex-basis]; }

order ( property for flex items )

아이템의 순서를 정한다.

플렉스 강의

https://opentutorials.org/course/2418/13526

플렉스 게임

http://flexboxfroggy.com/#ko

플렉스 코드펜

https://codepen.io/enxaneta/pen/adLPwv

.div-vertical {

    height: 50px;

    display: table-cell;

    vertical-align: middle;

}

height: 50px;