[CSS] flexbox (justify-content / align-items)


[CSS] flexbox (justify-content / align-items)

1. flexbox에서 box의 위치를 바꾸고 싶으면 부모 container가 display:flex를 달고 있어야 함. 2. flexbox css는 두 가지가 있음. 1) row (행) [horizontal] 2) column (열) [vertical] flex-direction: row가 기본값. 3. justify-content / align-items (position 속성) justify-content는 수평축에 있는 flex children의 위치를 변경. center/ space-between/ space-around 수평축 (main axis)에서 위치를 변경. main axis, cross axis를 항상 생각해야 한다. 위에서 말했듯이 지금 main axis 가 row인 상태에서, horizontal에서 바꾸려면 justify-content 사용. vertical에서 바꾸려면 align-items를 사용하면 된다. twitter @Pratham 앞서 말했던 flex...


#alignitems #column #crossaxis #css #flexbox #flexdirection #justifycontent #mainaxis #row

원문링크 : [CSS] flexbox (justify-content / align-items)