Style flexShrink attribute

Definition and Usage

flexShrink This attribute specifies how the item will shrink relative to other flexible items within the same container.

Note:If the element is not a flexible item, then flexShrink Invalid attribute.

See also:

CSS Reference Manual:flex-shrink attribute

Example

Make the blue DIV element shrink five times smaller than other flexible items:

document.getElementById("myBlueDiv").style.flexShrink = "5";

Try It Yourself

Syntax

Return flexShrink attribute:

object.style.flexShrink

Set flexShrink attribute:

object.style.flexShrink = "number|initial|inherit"

Attribute Value

Value Description
number A number that specifies how much the item will shrink relative to other flexible items. The default value is 0.
initial Set this attribute to its default value. See initial.
inherit Inherit this attribute from its parent element. See inherit.

Technical Details

Default value: 1
Return value: A string representing the element's flex-shrink attribute.
CSS Version: CSS3

Browser Support

The numbers in the table indicate the first browser version to fully support this attribute.

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support 11.0 Support 9.0 Support

Related Pages

HTML DOM STYLE Reference Manual:flex attribute

HTML DOM STYLE Reference Manual:flexBasis attribute

HTML DOM STYLE Reference Manual:flexDirection attribute

HTML DOM STYLE Reference Manual:flexFlow attribute

HTML DOM STYLE Reference Manual:flexGrow attribute

HTML DOM STYLE Reference Manual:flexWrap attribute