YouTip LogoYouTip

Prop Style Aligncontent

# Style alignContent property [![Image 8: Style ObjectsReference Manual](#) Style Objects](#) ## Example Align the items of a flexible
element: document.getElementById("myDIV").style.alignContent="center"; [Try it Β»](#) * * * ## Definition and Usage The alignContent property aligns the lines (vertically) in a flex container when the items in the flex container do not use all available space on the cross-axis. **Tip:** Use the justifyContent property to align the items on the main-axis (horizontally). **Note:** The container must have multiple lines for this property to have any effect. * * * ## Browser Support ![Image 9: Internet Explorer](#)![Image 10: Firefox](#)![Image 11: Opera](#)![Image 12: Google Chrome](#)![Image 13: Safari](#) Chrome and Opera support the alignContent property. * * * ## Syntax Get alignContent: _object_.style.alignContent Set alignContent: _object_.style.alignContent="stretch|center|flex-start|flex-end|space-between|space-around|initial|inherit" ## propertyValue | Value | Description | | --- | --- | | stretch | Default value. Lines are stretched to take up the remaining space. | | center | Lines are packed toward the center of the flex container. | | flex-start | Lines are packed toward the start of the flex container. | | flex-end | Lines are packed toward the end of the flex container. | | space-between | Lines are evenly distributed in the flex container; the first line is at the start of the container while the last one is at the end of the container. | | space-around | Lines are evenly distributed in the flex container, with half-size spaces on either end. | | initial | Sets this property to its default value. Read about _initial_. | | inherit | Inherits this property from its parent element. Read about _inherit_. | ## Technical Details | Default value: | stretch | | --- | --- | | Return Value: | A string, representing the align-content property of an element. | | CSS Version | CSS3 | * * * ## CSS Reference: (#) HTML DOM STYLE Reference: (#) HTML DOM STYLE Reference: (#) HTML DOM STYLE Reference: (#) * * Style Objects](#)
← Prop Style AlignitemsCss Combinators β†’