Press/to search

Flexbox

Order

Utilities for controls how flex items are ordered.


Class

classcss
order-firstorder: -9999
order-lastorder: 9999
order-noneorder: 0
order-1order: 1
order-2order: 2
order-3order: 3
order-4order: 4
order-5order: 5
order-6order: 6
order-7order: 7
order-8order: 8
order-9order: 9
order-10order: 10
order-11order: 11
order-12order: 12

Customization

Read more information about using the Plugin API, and Responsive or Pseudo-Class Variants configuration with the Plugin API.

// Add Values
@include yogurt(
$class: 'order',
$property: order,
$modifier: (
1: 1,
2: 2
//...
)
);

// Add Variants
@include yogurt(
$class: 'order',
$property: order,
$modifier: (
1: 1,
2: 2
//...
),
$variant: (
'responsive'
//...
)
);

Variant

ResponsiveDark ModeLight ModeReduce-MotionPortraitLandscapeHoverGroup-HoverFocusGroup-FocusFocus-VisibleFocus-WithinActiveVisitedCheckedDisabled

Default enabled variants. Read more information about the Responsive and Pseudo-Class Variants.