Scribd
Upload
5 views

Flexbox Contekan

The document explains flexbox and its main properties. Flexbox allows items to be arranged in either a row or column with options to wrap, space, and align items. Properties like flex-direction, justify-content, and align-items control the layout and positioning of flex items within the flex container.

Uploaded by

muhammad iqbal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
5 views

Flexbox Contekan

The document explains flexbox and its main properties. Flexbox allows items to be arranged in either a row or column with options to wrap, space, and align items. Properties like flex-direction, justify-content, and align-items control the layout and positioning of flex items within the flex container.

Uploaded by

muhammad iqbal
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 3

FLEXBOX

main size
cross start

flex-container
main start main end
cross size

main axis

cross axis
flex-item flex-item flex-item

cross end
flexbox

Display flex-flow flex-grow flex


( flex-grow, flex-shrink, flex-basis )
flex - inline-flex ( flex-direction, flex-wrap) 0·1·2·…
flex-container properties

flex-item properties
flex-direction flex-shrink
row · row-reverse · column · column-reverse 0·1·2· …

justify-content flex-basis
flex-start · flex-end · center · space-between · space-around · space-evenly auto · value · fill · min-content · …

align-items order
flex-start · flex-end · center · stretch · baseline 0·1·2·…

align-content align-self
flex-start · flex-end · center · stretch · space-between · space-around auto · flex-start · flex-end · center · stretch · baseline

flex-wrap
nowrap · wrap · wrap-reverse

You might also like