ABSTRACT

In Cascading Style Sheets (CSS), the layout of Web pages used to be achieved through the use of various sizing and positioning of CSS properties that were not designed specifically for the purpose. The CSS flexible box, also called flexbox, is a layout model that is intended to allow Web authors to arrange elements on a page such that they respond predictably or as intended to changes in screen sizes. Flex items are laid out along the main axis in the container starting at the main-start edge and going toward the main-end edge. The flow direction of flex items describes the direction in which flex items are laid out within the containing flex container. The properties for specifying the alignment for all the flex items contained in a flex container are justify-content, align-content, and align-items, all of which are specified only in the rule for the flex container since they are designed to affect all its content.