In most business situations,Ant Design need solve a lot of information storage problems within the design area,so based on 12 Grids System,we divided the design area into 24 aliquots.
We name the divided area as 'box'.We suggest that four boxes horizontal arrangement at most, one at least.Box on the proportion of the entire screen as above picture.To ensure that the level of visual comfort,we custom typography inside of the box based on the box unit.
* To establish a set of `column` in the horizontal direction by` row` (abbreviated col)
* Direct your content elements should be placed in the `col`, and only` col` as the `row`
* The column grid system is a value of 1-24 to represent its range spans.For example, three columns of equal width can be created by `.col-8`.
* If a `row` sum of` col` more than 24, then the extra `col` as a whole will start a new line arrangement.
## Flex layout
Our grid systems support Flex layout to allow the child elements within the parent horizontal alignment - Left, center, right of abode, and other wide arrangement, decentralized arrangement. Between sub-elements and sub-elements, support the top of the aligned vertically centered, bottom-aligned manner. At the same time, you can define the order of elements by using 'order'.
Flex layout is based on a grid 24 to define each "box" in width, but not rigidly adhere to the grid layout.
## API
Ant Design layout component if it can not meet your needs, you can use the excellent layout of the components of the community:
The breakpoints of responsive grid follow [BootStrap 3 media queries rules](https://getbootstrap.com/docs/3.3/css/#responsive-utilities-classes)(not contain `occasionally part`).
