Style alignItemsProperty
Style ObjectExamples
Center-align the items of a flexible <div> element:
document.getElementById("myDIV").style.alignItems="center";
Try it Yourself »
Definition and Usage
The alignItems property specifies the default alignment for items inside a flexible container.
Tip:Use the align-self property of each item to override the align-items implementation.
Browser Support
IE11, Firefox, Chrome, and Opera support the alignItems property.
Safari, IE 9 and earlier versions do not support the alignItems property. IE 10 requires the MS prefix.
Syntax
Return the alignItems property:
object.style.alignItems
Set the alignItems property:
object.style.alignItems="stretch|center|flex-start|flex-end|baseline|initial|inherit"
Property Values
| Value | Description |
|---|---|
| stretch | Default value. Items are stretched to fit the container. |
| center | Items are positioned at the center of the container. |
| flex-start | Items are positioned at the start of the container. |
| flex-end | Items are positioned at the end of the container. |
| baseline | Items are positioned on the baseline of the container. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default Value: | stretch |
|---|---|
| Return Value: | A string representing the align-items property of an element. |
| CSS Version | CSS3 |
Related Articles
CSS Reference Manual:align-items property
HTML DOM STYLE Reference Manual:alignContent property
HTML DOM STYLE Reference Manual:alignSelf property
Other Extensions