CSS – flexbox and align-items property

CSS – flexbox and align-items property

align-items determines how the flex items will be aligned in the cross-axis. Cross-axis is the perpendicular axis to the main-axis. It is the direction might the flex items warp. align-items is applies to the flex container. The values it can have are flex-start, flex-end, center, baseline and stretch. THE END!!! CSS – flexbox and align-items property

CSS – flexbox and align-items property Read More

CSS – flexbox and justify-content

CSS – flexbox and justify-content

justify-content aligns the flex items along the main axis. The main axis is the axis along which the flex items are laid out. row=horizontal axis and column=vertical axis. justify-content can take 5 values: flex-start, flex-end, center, space-between and space around. If reverse is used the flex-end and flex-start will be reversed. It is applies to the flex-container THE END!!! CSS – flexbox and justify-content

CSS – flexbox and justify-content Read More

CSS – Flexbox introduction

CSS – Flexbox introduction

Flexbox provides a more efficient layout even when the size is unknown. You can convert a container to a flex container by applying some css properties. Then this flex container will layout its children. flex container To create a flex container you need to set the display method of a container to flex or flex-inline. flex is for block elements and flex-inline for inline elements. Now let’s add the display:flex property to the parent container flex-flow is a property for the flex containers and specifies how to line up elements,…

CSS – Flexbox introduction Read More