box-pack
Summary
Do not use. This property has been replaced by flex-pack.
Overview table
- Initial value
start
- Applies to
- box elements
- Inherited
- No
- Media
- visual
- Animatable
- No
Syntax
box-pack: center
box-pack: end
box-pack: justify
box-pack: start
Values
- start
- The starting edge of the first child element is placed at the start of the parent element; the starting edge of the next child element is placed edge to edge with the ending edge of the first child element; and so on along the layout axis direction. All space that remains along the layout axis is placed at the end of the layout axis.
- end
- The ending edge of the first child element is placed at the end of the parent element; the ending edge of the next child element is placed edge to edge with the starting edge of the first child element; and so on along the layout axis direction. All space remaining along the layout axis is placed at the start of the layout axis.
- center
- All child elements are placed edge to edge with each other, as described in the descriptions for the [#start start] or [#end end] keywords. However, the group of child elements is centered between the starting and ending edges of the parent element so that all remaining space is evenly distributed before the first child element and after the last child element.
- justify
- The starting edge of the first child element is placed at the start of the parent element; the ending edge of the last child element is placed edge to edge with the end of the parent box; and all remaining children are placed between the first and last child elements, so that any space that remains along the layout axis is equally distributed between child elements.
Notes
Remarks
Be aware that these are writing-mode dependent keywords; the starting and ending edges of the parent element and child elements depend on the layout direction. For instance, for a left-to-right layout, the starting edge is the left edge of the parent element, for a top-to-bottom layout the starting edge is the top edge, and so on. Likewise, the ending edge of a child element is the right edge in a left-to-right layout, the bottom edge in a top-to-bottom layout, and so on.
Related specifications
- Flexible Box Layout Module
- W3C Working Draft (Obsolete)
See also
Related articles
CSS Layout
box-pack
Related pages
- CSSStyleDeclarationCSSStyleDeclaration
Attributions
Microsoft Developer Network: [Windows Internet Explorer API reference Article]