Flex Grid

The grid depends on the flex display property. It consists of a number of features that are available with the flexbox, like automatic stacking, source ordering, vertical alignment and horizontal alignment.

Browser Support

The flex grid is supported in Chrome, Firefox, Internet Explorer 10+, Safari 6+, Android 4+ and iOS 7+.

The following table describes the features of Flex Grid along with the description.

Sr.No.Features & Description
1ImportingIt includes the export mixin for the flex grid to use the default CSS.
2BasicsThe Flex grid structure is similar to that of float grid.
3Advanced SizingIf the sizing class is not included in the column, then it expands itself and fills the remaining space in the column.
4Responsive AdjustmentsIf the explicit size of column in flex grid is not given, then it will auto-size the columns
5Column AlignmentThe flex grid columns can be aligned horizontal or vertical axis in the parent row.
6Source OrderingSource ordering helps to rearrange the column in different size of screens.
7Sass ReferenceSASS (Syntactically Awesome Stylesheet) is a CSS pre-processor which helps to reduce repetition with CSS and saves time.

Comments

Leave a Reply

Your email address will not be published. Required fields are marked *