Xidipity

Knowledge Base

flex (d) – growth-shrink
Flexbox: Items Growth/Shrink
Xidipity WordPress Theme Knowledge Base Flexbox Content Header Image
no preference
 
  • class: fxd:1
  • css: -webkit-order: 0;
  •   -ms-flex-order: 0;
  •   order: 0;
  •   -webkit-flex: 0 0 auto;
  •   -ms-flex: 0 0 auto;
  •   flex: 0 0 auto;

 

shrink preference
 
  • class: fxd:2
  • css: -webkit-order: 0;
  •   -ms-flex-order: 0;
  •   order: 0;
  •   -webkit-flex: 0 1 auto;
  •   -ms-flex: 0 1 auto;
  •   flex: 0 1 auto;

 

growth preference
 
  • class: fxd:3
  • css: -webkit-order: 0;
  •   -ms-flex-order: 0;
  •   order: 0;
  •   -webkit-flex: 1 0 auto;
  •   -ms-flex: 1 0 auto;
  •   flex: 1 0 auto;

 

shrink & growth preference
 
  • class: fxd:4
  • css: -webkit-order: 0;
  •   -ms-flex-order: 0;
  •   order: 0;
  •   -webkit-flex: 1 1 auto;
  •   -ms-flex: 1 1 auto;
  •   flex: 1 1 auto;

 

Abbreviations
 
AbbreviationDefinition
fxdflexbox item growth/shrink

 

Supported media
 
AbbreviationDefinition
all
sm)small
md)medium
lg)large
xlextra large
Notes
 

All flexbox classes begin with “fxd” and are separated by a colon from it’s value.


  • Since: v1.0.0

 

September 24, 2022