Old Box review, box Review

Old Box review, box Review

Old box:

Parent element: display:-webkit-box; (the spindle is horizontal =-webkit-box-orient: horizontal). You can use this effect to add overflow: hidden for simple carousel images;

Cross axis:-webkit-box-align: stretch (stretch, when the child element is not set to height), start, end, center, baseline;

On the main axis: (if you want to see the effect, do not set box-flex for the child element)-webkit-box-pack: start (default), end center, justify

When the spindle is defined as the vertical direction:-webkit-box-orient: vertical; in this case, the direction of the cross axis is interchangeable with that of the spindle.

-Webkit-box-direction: sorting order of normal and reverse (reverse) subelements;

Child element:-webkit-box-flex: integer; declares the number of parts occupied by the child element. If the total width of the child element exceeds the parent element, then, the excess part is divided by the value of the corresponding number of parts to X, and then each sub-element reduces the number of corresponding parts by X based on the specified width.

-Webkit-box-flex-group: integer (1 by default) must first have box-flex, and then find the child element with the largest value in the child element, the width is the width of the content (if there is no content, padding, border does not exist), and the remaining sub-elements are allocated according to the number of box-flex parts occupied by the sub-elements.

-Webkit-box-ordinal-group: integer; the sub-elements are arranged in the order of small values before the sub-elements. The same values are arranged in the order of document streams. The default value is 1, the acceptable minimum value is also 1. If the value is smaller than 1, the default value is used.

---------------------------------------------------------