Style flexShrinkProperty
Examples
Make the blue DIV element shrink to one-fifth of other flexible items:
document.getElementById("myBlueDiv".style.flexShrink = "5";
Try it yourself »
Definition and Usage
The flexShrink property specifies the amount by which an item will shrink relative to other flexible items in the same container.
Note:If the element is not a flexible item, the flexShrink property has no effect.
Browser Support
![]()
Firefox, Opera, and Chrome support the flexShrink property.
Syntax
Return the flexShrink property:
object.style.flexShrink
Set the flexShrink property:
object.style.flexShrink="number|initial|inherit"
Property Values
| Value | Description |
|---|---|
| number | A number specifying the amount by which the item will shrink relative to other flexible items. The default value is 0. |
| initial | Sets this property to its default value. Seeinitial。 |
| inherit | Inherits this property from its parent element. Seeinherit。 |
Technical Details
| Default value: | 1 |
|---|---|
| Return value: | A string representing the flex-shrink property of an element. |
| CSS Version | CSS3 |
Related Articles
CSS Reference Manual:flex-shrink property
HTML DOM STYLE Reference Manual:flex property
HTML DOM STYLE Reference Manual:flexBasis property
HTML DOM STYLE Reference Manual:flexDirection property
HTML DOM STYLE Reference Manual:flexFlow property
HTML DOM STYLE Reference Manual:flexGrow property
HTML DOM STYLE Reference Manual:flexWrap property
Other Extensions
Style Object