KSS Style Guide

6.1 #Flex - Align Items Align Items

Classes for setting the align-items property on an element. Can also be used with css grid.

Source: dist/standard/standard.css, line 3433

6.1.1 #Flex - Align Items - ctr .ai-ctr

Sets align-items to center.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-ctr

Sets align-items to center

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3457

6.1.1.1 #Flex - Align Items - ctr - sm .ai-sm-ctr

Sets align-items to center on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-sm-ctr

Sets align-items to center on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5419

6.1.2 #Flex - Align Items - end .ai-end

Sets align-items to flex-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-end

Sets align-items to flex-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3491

6.1.2.1 #Flex - Align Items - end - sm .ai-sm-end

Sets align-items to flex-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-sm-end

Sets align-items to flex-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5453

6.1.3 #Flex - Align Items - stc .ai-stc

Sets align-items to stretch.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-stc

Sets align-items to stretch

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3440

6.1.3.1 #Flex - Align Items - stc - sm .ai-sm-stc

Sets align-items to stretch on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-sm-stc

Sets align-items to stretch on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5402

6.1.4 #Flex - Align Items - str .ai-str

Sets align-items to flex-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-str

Sets align-items to flex-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3474

6.1.4.1 #Flex - Align Items - str - sm .ai-sm-str

Sets align-items to flex-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.ai-sm-str

Sets align-items to flex-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5436

6.2 #Flex - Align Self Align Self

Classes for setting the align-self property on an element. Can also be used with css grid.

Source: dist/standard/standard.css, line 3634

6.2.1 #Flex - Align Self - ctr .as-ctr

Sets align-self to center.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-ctr

Sets align-self to center

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3658

6.2.1.1 #Flex - Align Self - ctr - sm .as-sm-ctr

Sets align-self to center on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-ctr

Sets align-self to center on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5606

6.2.2 #Flex - Align Self - end .as-end

Sets align-self to flex-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-end

Sets align-self to flex-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3692

6.2.2.1 #Flex - Align Self - end - sm .as-sm-end

Sets align-self to flex-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-end

Sets align-self to flex-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5640

6.2.3 #Flex - Align Self - sse .as-sse

Sets align-self to self-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sse

Sets align-self to self-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3726

6.2.3.1 #Flex - Align Self - sse - sm .as-sm-sse

Sets align-self to self-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-sse

Sets align-self to self-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5674

6.2.4 #Flex - Align Self - sst .as-sst

Sets align-self to self-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sst

Sets align-self to self-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3709

6.2.4.1 #Flex - Align Self - sst - sm .as-sm-sst

Sets align-self to self-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-sst

Sets align-self to self-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5657

6.2.5 #Flex - Align Self - stc .as-stc

Sets align-self to stretch.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-stc

Sets align-self to stretch

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3641

6.2.5.1 #Flex - Align Self - stc - sm .as-sm-stc

Sets align-self to stretch on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-stc

Sets align-self to stretch on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5589

6.2.6 #Flex - Align Self - str .as-str

Sets align-self to flex-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-str

Sets align-self to flex-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3675

6.2.6.1 #Flex - Align Self - str - sm .as-sm-str

Sets align-self to flex-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.as-sm-str

Sets align-self to flex-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5623

6.3 #Flex - Basis Flex Basis

Classes for setting the flex-basis property on an element.

Source: dist/standard/standard.css, line 3163

6.3.1 #Flex - Basis - auto .flb-auto

Sets flex-basis to auto.

Examples

Default styling

A div

B div

C div

.flb-auto

Sets flex-basis to auto

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3170

6.3.1.1 #Flex - Basis - auto - sm .flb-sm-auto

Sets flex-basis to auto on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-auto

Sets flex-basis to auto on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5210

6.3.2 #Flex - Basis - content .flb-content

Sets flex-basis to content.

Examples

Default styling

A div

B div

C div

.flb-content

Sets flex-basis to content

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3250

6.3.2.1 #Flex - Basis - content - sm .flb-sm-content

Sets flex-basis to content on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-content

Sets flex-basis to content on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5290

6.3.3 #Flex - Basis - fill .flb-fill

Sets flex-basis to fill.

Examples

Default styling

A div

B div

C div

.flb-fill

Sets flex-basis to fill

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3186

6.3.3.1 #Flex - Basis - fill - sm .flb-sm-fill

Sets flex-basis to fill on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-fill

Sets flex-basis to fill on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5226

6.3.4 #Flex - Basis - fit-content .flb-fit-content

Sets flex-basis to fit-content.

Examples

Default styling

A div

B div

C div

.flb-fit-content

Sets flex-basis to fit-content

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3234

6.3.4.1 #Flex - Basis - fit-content - sm .flb-sm-fit-content

Sets flex-basis to fit-content on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-fit-content

Sets flex-basis to fit-content on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5274

6.3.5 #Flex - Basis - max-content .flb-max-content

Sets flex-basis to max-content.

Examples

Default styling

A div

B div

C div

.flb-max-content

Sets flex-basis to max-content

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3202

6.3.5.1 #Flex - Basis - max-content - sm .flb-sm-max-content

Sets flex-basis to max-content on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-max-content

Sets flex-basis to max-content on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5242

6.3.6 #Flex - Basis - min-content .flb-min-content

Sets flex-basis to min-content.

Examples

Default styling

A div

B div

C div

.flb-min-content

Sets flex-basis to min-content

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3218

6.3.6.1 #Flex - Basis - min-content - sm .flb-sm-min-content

Sets flex-basis to min-content on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-min-content

Sets flex-basis to min-content on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5258

6.3.7 #Flex - Basis - p0 .flb-p0

Sets flex-basis to 0%.

Examples

Default styling

A div

B div

C div

.flb-p0

Sets flex-basis to 0%

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3282

6.3.7.1 #Flex - Basis - p0 - sm .flb-sm-p0

Sets flex-basis to 0% on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-p0

Sets flex-basis to 0% on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5322

6.3.8 #Flex - Basis - p100 .flb-p100

Sets flex-basis to 100%.

Examples

Default styling

A div

B div

C div

.flb-p100

Sets flex-basis to 100%

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3346

6.3.8.1 #Flex - Basis - p100 - sm .flb-sm-p100

Sets flex-basis to 100% on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-p100

Sets flex-basis to 100% on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5386

6.3.9 #Flex - Basis - p25 .flb-p25

Sets flex-basis to 25%.

Examples

Default styling

A div

B div

C div

.flb-p25

Sets flex-basis to 25%

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3298

6.3.9.1 #Flex - Basis - p25 - sm .flb-sm-p25

Sets flex-basis to 25% on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-p25

Sets flex-basis to 25% on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5338

6.3.10 #Flex - Basis - p50 .flb-p50

Sets flex-basis to 50%.

Examples

Default styling

A div

B div

C div

.flb-p50

Sets flex-basis to 50%

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3314

6.3.10.1 #Flex - Basis - p50 - sm .flb-sm-p50

Sets flex-basis to 50% on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-p50

Sets flex-basis to 50% on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5354

6.3.11 #Flex - Basis - p75 .flb-p75

Sets flex-basis to 75%.

Examples

Default styling

A div

B div

C div

.flb-p75

Sets flex-basis to 75%

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3330

6.3.11.1 #Flex - Basis - p75 - sm .flb-sm-p75

Sets flex-basis to 75% on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-p75

Sets flex-basis to 75% on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5370

6.3.12 #Flex - Basis - unset .flb-unset

Sets flex-basis to unset.

Examples

Default styling

A div

B div

C div

.flb-unset

Sets flex-basis to unset

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3266

6.3.12.1 #Flex - Basis - unset - sm .flb-sm-unset

Sets flex-basis to unset on sm.

Examples

Default styling

A div

B div

C div

.flb-sm-unset

Sets flex-basis to unset on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1 [modifier class]">B div</div><div class="fls-1-1 [modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5306

6.4 #Flex - Direction Flex Direction

Classes for turning on flex and setting the flex direction of an element.

Source: dist/standard/standard.css, line 2137

6.4.1 #Flex - Direction - col .fld-col

Sets display: flex and sets flex-direction of an element to column.

Examples

Default styling

A div

B div

.fld-col

Sets flex-direction to column

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 2161

6.4.1.1 #Flex - Direction - col - sm .fld-sm-col

Sets display: flex and sets flex-direction of an element to column on sm.

Examples

Default styling

A div

B div

.fld-sm-col

Sets flex-direction to column on sm

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 3870

6.4.2 #Flex - Direction - colr .fld-colr

Sets display: flex and sets flex-direction of an element to column-reverse.

Examples

Default styling

A div

B div

.fld-colr

Sets flex-direction to column-reverse

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 2195

6.4.2.1 #Flex - Direction - colr - sm .fld-sm-colr

Sets display: flex and sets flex-direction of an element to column-reverse on sm.

Examples

Default styling

A div

B div

.fld-sm-colr

Sets flex-direction to column-reverse on sm

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 3904

6.4.3 #Flex - Direction - row .fld-row

Sets display: flex and sets flex-direction of an element to row.

Examples

Default styling

A div

B div

.fld-row

Sets flex-direction to row

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 2144

6.4.3.1 #Flex - Direction - row - sm .fld-sm-row

Sets display: flex and sets flex-direction of an element to row on sm.

Examples

Default styling

A div

B div

.fld-sm-row

Sets flex-direction to row on sm

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 3853

6.4.4 #Flex - Direction - rowr .fld-rowr

Sets display: flex and sets flex-direction of an element to row-reverse.

Examples

Default styling

A div

B div

.fld-rowr

Sets flex-direction to row-reverse

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 2178

6.4.4.1 #Flex - Direction - rowr - sm .fld-sm-rowr

Sets display: flex and sets flex-direction of an element to row-reverse on sm.

Examples

Default styling

A div

B div

.fld-sm-rowr

Sets flex-direction to row-reverse on sm

A div

B div

Markup

<div class="[modifier class]"><div>A div</div><div>B div</div></div>

Source: dist/standard/standard.css, line 3887

6.5 #Flex - Gaps Flex Gaps

Classes for creating gaps between flex children based on margin sizes.

Source: dist/standard/standard.css, line 2212

6.5.1 #Flex - Gaps - col .flg-0

Sets the margin of all children except last to margin var for 0.

Examples

Default styling

A div

B div

C div

.flg-0

Sets gaps to margin var for 0

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2235

6.5.1 #Flex - Gaps - col .flg-1

Sets the margin of all children except last to margin var for 1.

Examples

Default styling

A div

B div

C div

.flg-1

Sets gaps to margin var for 1

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2299

6.5.1 #Flex - Gaps - col .flg-2

Sets the margin of all children except last to margin var for 2.

Examples

Default styling

A div

B div

C div

.flg-2

Sets gaps to margin var for 2

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2363

6.5.1 #Flex - Gaps - col .flg-3

Sets the margin of all children except last to margin var for 3.

Examples

Default styling

A div

B div

C div

.flg-3

Sets gaps to margin var for 3

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2427

6.5.1 #Flex - Gaps - col .flg-4

Sets the margin of all children except last to margin var for 4.

Examples

Default styling

A div

B div

C div

.flg-4

Sets gaps to margin var for 4

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2491

6.5.1 #Flex - Gaps - col .flg-5

Sets the margin of all children except last to margin var for 5.

Examples

Default styling

A div

B div

C div

.flg-5

Sets gaps to margin var for 5

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2555

6.5.1 #Flex - Gaps - col .flg-6

Sets the margin of all children except last to margin var for 6.

Examples

Default styling

A div

B div

C div

.flg-6

Sets gaps to margin var for 6

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2619

6.5.1 #Flex - Gaps - col .flg-7

Sets the margin of all children except last to margin var for 7.

Examples

Default styling

A div

B div

C div

.flg-7

Sets gaps to margin var for 7

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2683

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-0

Sets the margin of all children except last to margin var for 0 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-0

Sets gaps to margin var for 0 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3948

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-1

Sets the margin of all children except last to margin var for 1 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-1

Sets gaps to margin var for 1 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4056

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-2

Sets the margin of all children except last to margin var for 2 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-2

Sets gaps to margin var for 2 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4164

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-3

Sets the margin of all children except last to margin var for 3 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-3

Sets gaps to margin var for 3 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4272

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-4

Sets the margin of all children except last to margin var for 4 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-4

Sets gaps to margin var for 4 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4380

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-5

Sets the margin of all children except last to margin var for 5 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-5

Sets gaps to margin var for 5 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4488

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-6

Sets the margin of all children except last to margin var for 6 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-6

Sets gaps to margin var for 6 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4596

6.5.1.1 #Flex - Gaps - col - sm .flg-sm-7

Sets the margin of all children except last to margin var for 7 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-7

Sets gaps to margin var for 7 on sm

A div

B div

C div

Markup

<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4704

6.5.2 #Flex - Gaps - colr .flg-0

Sets the margin of all children except last to margin var for 0.

Examples

Default styling

A div

B div

C div

.flg-0

Sets gaps to margin var for 0

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2267

6.5.2 #Flex - Gaps - colr .flg-1

Sets the margin of all children except last to margin var for 1.

Examples

Default styling

A div

B div

C div

.flg-1

Sets gaps to margin var for 1

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2331

6.5.2 #Flex - Gaps - colr .flg-2

Sets the margin of all children except last to margin var for 2.

Examples

Default styling

A div

B div

C div

.flg-2

Sets gaps to margin var for 2

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2395

6.5.2 #Flex - Gaps - colr .flg-3

Sets the margin of all children except last to margin var for 3.

Examples

Default styling

A div

B div

C div

.flg-3

Sets gaps to margin var for 3

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2459

6.5.2 #Flex - Gaps - colr .flg-4

Sets the margin of all children except last to margin var for 4.

Examples

Default styling

A div

B div

C div

.flg-4

Sets gaps to margin var for 4

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2523

6.5.2 #Flex - Gaps - colr .flg-5

Sets the margin of all children except last to margin var for 5.

Examples

Default styling

A div

B div

C div

.flg-5

Sets gaps to margin var for 5

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2587

6.5.2 #Flex - Gaps - colr .flg-6

Sets the margin of all children except last to margin var for 6.

Examples

Default styling

A div

B div

C div

.flg-6

Sets gaps to margin var for 6

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2651

6.5.2 #Flex - Gaps - colr .flg-7

Sets the margin of all children except last to margin var for 7.

Examples

Default styling

A div

B div

C div

.flg-7

Sets gaps to margin var for 7

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2715

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-0

Sets the margin of all children except last to margin var for 0 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-0

Sets gaps to margin var for 0 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4002

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-1

Sets the margin of all children except last to margin var for 1 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-1

Sets gaps to margin var for 1 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4110

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-2

Sets the margin of all children except last to margin var for 2 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-2

Sets gaps to margin var for 2 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4218

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-3

Sets the margin of all children except last to margin var for 3 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-3

Sets gaps to margin var for 3 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4326

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-4

Sets the margin of all children except last to margin var for 4 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-4

Sets gaps to margin var for 4 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4434

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-5

Sets the margin of all children except last to margin var for 5 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-5

Sets gaps to margin var for 5 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4542

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-6

Sets the margin of all children except last to margin var for 6 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-6

Sets gaps to margin var for 6 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4650

6.5.2.1 #Flex - Gaps - colr - sm .flg-sm-7

Sets the margin of all children except last to margin var for 7 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-7

Sets gaps to margin var for 7 on sm

A div

B div

C div

Markup

<div class="fld-colr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4758

6.5.3 #Flex - Gaps - row .flg-0

Sets the margin of all children except last to margin var for 0.

Examples

Default styling

A div

B div

C div

.flg-0

Sets gaps to margin var for 0

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2219

6.5.3 #Flex - Gaps - row .flg-1

Sets the margin of all children except last to margin var for 1.

Examples

Default styling

A div

B div

C div

.flg-1

Sets gaps to margin var for 1

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2283

6.5.3 #Flex - Gaps - row .flg-2

Sets the margin of all children except last to margin var for 2.

Examples

Default styling

A div

B div

C div

.flg-2

Sets gaps to margin var for 2

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2347

6.5.3 #Flex - Gaps - row .flg-3

Sets the margin of all children except last to margin var for 3.

Examples

Default styling

A div

B div

C div

.flg-3

Sets gaps to margin var for 3

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2411

6.5.3 #Flex - Gaps - row .flg-4

Sets the margin of all children except last to margin var for 4.

Examples

Default styling

A div

B div

C div

.flg-4

Sets gaps to margin var for 4

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2475

6.5.3 #Flex - Gaps - row .flg-5

Sets the margin of all children except last to margin var for 5.

Examples

Default styling

A div

B div

C div

.flg-5

Sets gaps to margin var for 5

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2539

6.5.3 #Flex - Gaps - row .flg-6

Sets the margin of all children except last to margin var for 6.

Examples

Default styling

A div

B div

C div

.flg-6

Sets gaps to margin var for 6

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2603

6.5.3 #Flex - Gaps - row .flg-7

Sets the margin of all children except last to margin var for 7.

Examples

Default styling

A div

B div

C div

.flg-7

Sets gaps to margin var for 7

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2667

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-0

Sets the margin of all children except last to margin var for 0 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-0

Sets gaps to margin var for 0 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3921

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-1

Sets the margin of all children except last to margin var for 1 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-1

Sets gaps to margin var for 1 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4029

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-2

Sets the margin of all children except last to margin var for 2 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-2

Sets gaps to margin var for 2 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4137

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-3

Sets the margin of all children except last to margin var for 3 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-3

Sets gaps to margin var for 3 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4245

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-4

Sets the margin of all children except last to margin var for 4 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-4

Sets gaps to margin var for 4 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4353

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-5

Sets the margin of all children except last to margin var for 5 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-5

Sets gaps to margin var for 5 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4461

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-6

Sets the margin of all children except last to margin var for 6 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-6

Sets gaps to margin var for 6 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4569

6.5.3.1 #Flex - Gaps - row - sm .flg-sm-7

Sets the margin of all children except last to margin var for 7 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-7

Sets gaps to margin var for 7 on sm

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4677

6.5.4 #Flex - Gaps - rowr .flg-0

Sets the margin of all children except last to margin var for 0.

Examples

Default styling

A div

B div

C div

.flg-0

Sets gaps to margin var for 0

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2251

6.5.4 #Flex - Gaps - rowr .flg-1

Sets the margin of all children except last to margin var for 1.

Examples

Default styling

A div

B div

C div

.flg-1

Sets gaps to margin var for 1

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2315

6.5.4 #Flex - Gaps - rowr .flg-2

Sets the margin of all children except last to margin var for 2.

Examples

Default styling

A div

B div

C div

.flg-2

Sets gaps to margin var for 2

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2379

6.5.4 #Flex - Gaps - rowr .flg-3

Sets the margin of all children except last to margin var for 3.

Examples

Default styling

A div

B div

C div

.flg-3

Sets gaps to margin var for 3

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2443

6.5.4 #Flex - Gaps - rowr .flg-4

Sets the margin of all children except last to margin var for 4.

Examples

Default styling

A div

B div

C div

.flg-4

Sets gaps to margin var for 4

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2507

6.5.4 #Flex - Gaps - rowr .flg-5

Sets the margin of all children except last to margin var for 5.

Examples

Default styling

A div

B div

C div

.flg-5

Sets gaps to margin var for 5

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2571

6.5.4 #Flex - Gaps - rowr .flg-6

Sets the margin of all children except last to margin var for 6.

Examples

Default styling

A div

B div

C div

.flg-6

Sets gaps to margin var for 6

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2635

6.5.4 #Flex - Gaps - rowr .flg-7

Sets the margin of all children except last to margin var for 7.

Examples

Default styling

A div

B div

C div

.flg-7

Sets gaps to margin var for 7

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 2699

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-0

Sets the margin of all children except last to margin var for 0 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-0

Sets gaps to margin var for 0 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3975

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-1

Sets the margin of all children except last to margin var for 1 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-1

Sets gaps to margin var for 1 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4083

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-2

Sets the margin of all children except last to margin var for 2 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-2

Sets gaps to margin var for 2 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4191

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-3

Sets the margin of all children except last to margin var for 3 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-3

Sets gaps to margin var for 3 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4299

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-4

Sets the margin of all children except last to margin var for 4 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-4

Sets gaps to margin var for 4 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4407

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-5

Sets the margin of all children except last to margin var for 5 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-5

Sets gaps to margin var for 5 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4515

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-6

Sets the margin of all children except last to margin var for 6 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-6

Sets gaps to margin var for 6 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4623

6.5.4.1 #Flex - Gaps - rowr - sm .flg-sm-7

Sets the margin of all children except last to margin var for 7 on sm.

Examples

Default styling

A div

B div

C div

.flg-sm-7

Sets gaps to margin var for 7 on sm

A div

B div

C div

Markup

<div class="fld-rowr [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 4731

6.6 #Flex - Justify Content Justify Content

Classes for setting the justify-content property on an element. Can also be used with css grid.

Source: dist/standard/standard.css, line 3508

6.6.1 #Flex - Justify Content - ctr .jc-ctr

Sets justify-content to center.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-ctr

Sets justify-content to center

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3515

6.6.1.1 #Flex - Justify Content - ctr - sm .jc-sm-ctr

Sets justify-content to center on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-ctr

Sets justify-content to center on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5470

6.6.2 #Flex - Justify Content - end .jc-end

Sets justify-content to flex-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-end

Sets justify-content to flex-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3549

6.6.2.1 #Flex - Justify Content - end - sm .jc-sm-end

Sets justify-content to flex-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-end

Sets justify-content to flex-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5504

6.6.3 #Flex - Justify Content - spa .jc-spa

Sets justify-content to space-around.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-spa

Sets justify-content to space-around

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3583

6.6.3.1 #Flex - Justify Content - spa - sm .jc-sm-spa

Sets justify-content to space-around on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-spa

Sets justify-content to space-around on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5538

6.6.4 #Flex - Justify Content - spb .jc-spb

Sets justify-content to space-between.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-spb

Sets justify-content to space-between

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3566

6.6.4.1 #Flex - Justify Content - spb - sm .jc-sm-spb

Sets justify-content to space-between on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-spb

Sets justify-content to space-between on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5521

6.6.5 #Flex - Justify Content - spe .jc-spe

Sets justify-content to space-evenly.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-spe

Sets justify-content to space-evenly

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3600

6.6.5.1 #Flex - Justify Content - spe - sm .jc-sm-spe

Sets justify-content to space-evenly on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-spe

Sets justify-content to space-evenly on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5555

6.6.6 #Flex - Justify Content - stc .jc-stc

Sets justify-content to stretch.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-stc

Sets justify-content to stretch

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3617

6.6.6.1 #Flex - Justify Content - stc - sm .jc-sm-stc

Sets justify-content to stretch on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-stc

Sets justify-content to stretch on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5572

6.6.7 #Flex - Justify Content - str .jc-str

Sets justify-content to flex-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-str

Sets justify-content to flex-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3532

6.6.7.1 #Flex - Justify Content - str - sm .jc-sm-str

Sets justify-content to flex-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.jc-sm-str

Sets justify-content to flex-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5487

6.7 #Flex - Justify Self Justify Self

Classes for setting the justify-self property on an element. Can also be used with css grid.

Source: dist/standard/standard.css, line 3743

6.7.1 #Flex - Justify Self - ctr .js-ctr

Sets justify-self to center.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-ctr

Sets justify-self to center

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3767

6.7.1.1 #Flex - Justify Self - ctr - sm .js-sm-ctr

Sets justify-self to center on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-ctr

Sets justify-self to center on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5708

6.7.2 #Flex - Justify Self - end .js-end

Sets justify-self to flex-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-end

Sets justify-self to flex-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3801

6.7.2.1 #Flex - Justify Self - end - sm .js-sm-end

Sets justify-self to flex-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-end

Sets justify-self to flex-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5742

6.7.3 #Flex - Justify Self - sse .js-sse

Sets justify-self to self-end.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sse

Sets justify-self to self-end

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3835

6.7.3.1 #Flex - Justify Self - sse - sm .js-sm-sse

Sets justify-self to self-end on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-sse

Sets justify-self to self-end on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5776

6.7.4 #Flex - Justify Self - sst .js-sst

Sets justify-self to self-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sst

Sets justify-self to self-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3818

6.7.4.1 #Flex - Justify Self - sst - sm .js-sm-sst

Sets justify-self to self-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-sst

Sets justify-self to self-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5759

6.7.5 #Flex - Justify Self - stc .js-stc

Sets justify-self to stretch.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-stc

Sets justify-self to stretch

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3750

6.7.5.1 #Flex - Justify Self - stc - sm .js-sm-stc

Sets justify-self to stretch on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-stc

Sets justify-self to stretch on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5691

6.7.6 #Flex - Justify Self - str .js-str

Sets justify-self to flex-start.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-str

Sets justify-self to flex-start

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3784

6.7.6.1 #Flex - Justify Self - str - sm .js-sm-str

Sets justify-self to flex-start on sm.

Examples

Default styling

A div

B div

C div

A div

B div

C div

.js-sm-str

Sets justify-self to flex-start on sm

A div

B div

C div

A div

B div

C div

Markup

<div class="fld-row"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>
<div class="fld-col"><div class="fls-1-1 [modifier class]">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 5725

6.8 #Flex - Size Flex Size

Classes for setting flex-grow and flex-shrink properties on an element.

Source: dist/standard/standard.css, line 2731

6.8.1 #Flex - Size - 0:0 .fls-0-0

Sets flex-grow to 0 and flex-shrink to 0.

Examples

Default styling

A div

B div

C div

.fls-0-0

Sets flex-grow to 0 and flex-shrink to 0

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2738

6.8.1.1 #Flex - Size - 0:0 - sm .fls-sm-0-0

Sets flex-grow to 0 and flex-shrink to 0 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-0-0

Sets flex-grow to 0 and flex-shrink to 0 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4785

6.8.2 #Flex - Size - 0:1 .fls-0-1

Sets flex-grow to 0 and flex-shrink to 1.

Examples

Default styling

A div

B div

C div

.fls-0-1

Sets flex-grow to 0 and flex-shrink to 1

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2755

6.8.2.1 #Flex - Size - 0:1 - sm .fls-sm-0-1

Sets flex-grow to 0 and flex-shrink to 1 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-0-1

Sets flex-grow to 0 and flex-shrink to 1 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4802

6.8.3 #Flex - Size - 0:2 .fls-0-2

Sets flex-grow to 0 and flex-shrink to 2.

Examples

Default styling

A div

B div

C div

.fls-0-2

Sets flex-grow to 0 and flex-shrink to 2

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2772

6.8.3.1 #Flex - Size - 0:2 - sm .fls-sm-0-2

Sets flex-grow to 0 and flex-shrink to 2 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-0-2

Sets flex-grow to 0 and flex-shrink to 2 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4819

6.8.4 #Flex - Size - 0:3 .fls-0-3

Sets flex-grow to 0 and flex-shrink to 3.

Examples

Default styling

A div

B div

C div

.fls-0-3

Sets flex-grow to 0 and flex-shrink to 3

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2789

6.8.4.1 #Flex - Size - 0:3 - sm .fls-sm-0-3

Sets flex-grow to 0 and flex-shrink to 3 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-0-3

Sets flex-grow to 0 and flex-shrink to 3 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4836

6.8.5 #Flex - Size - 0:4 .fls-0-4

Sets flex-grow to 0 and flex-shrink to 4.

Examples

Default styling

A div

B div

C div

.fls-0-4

Sets flex-grow to 0 and flex-shrink to 4

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2806

6.8.5.1 #Flex - Size - 0:4 - sm .fls-sm-0-4

Sets flex-grow to 0 and flex-shrink to 4 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-0-4

Sets flex-grow to 0 and flex-shrink to 4 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4853

6.8.6 #Flex - Size - 1:0 .fls-1-0

Sets flex-grow to 1 and flex-shrink to 0.

Examples

Default styling

A div

B div

C div

.fls-1-0

Sets flex-grow to 1 and flex-shrink to 0

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2823

6.8.6.1 #Flex - Size - 1:0 - sm .fls-sm-1-0

Sets flex-grow to 1 and flex-shrink to 0 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-1-0

Sets flex-grow to 1 and flex-shrink to 0 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4870

6.8.7 #Flex - Size - 1:1 .fls-1-1

Sets flex-grow to 1 and flex-shrink to 1.

Examples

Default styling

A div

B div

C div

.fls-1-1

Sets flex-grow to 1 and flex-shrink to 1

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2840

6.8.7.1 #Flex - Size - 1:1 - sm .fls-sm-1-1

Sets flex-grow to 1 and flex-shrink to 1 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-1-1

Sets flex-grow to 1 and flex-shrink to 1 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4887

6.8.8 #Flex - Size - 1:2 .fls-1-2

Sets flex-grow to 1 and flex-shrink to 2.

Examples

Default styling

A div

B div

C div

.fls-1-2

Sets flex-grow to 1 and flex-shrink to 2

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2857

6.8.8.1 #Flex - Size - 1:2 - sm .fls-sm-1-2

Sets flex-grow to 1 and flex-shrink to 2 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-1-2

Sets flex-grow to 1 and flex-shrink to 2 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4904

6.8.9 #Flex - Size - 1:3 .fls-1-3

Sets flex-grow to 1 and flex-shrink to 3.

Examples

Default styling

A div

B div

C div

.fls-1-3

Sets flex-grow to 1 and flex-shrink to 3

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2874

6.8.9.1 #Flex - Size - 1:3 - sm .fls-sm-1-3

Sets flex-grow to 1 and flex-shrink to 3 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-1-3

Sets flex-grow to 1 and flex-shrink to 3 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4921

6.8.10 #Flex - Size - 1:4 .fls-1-4

Sets flex-grow to 1 and flex-shrink to 4.

Examples

Default styling

A div

B div

C div

.fls-1-4

Sets flex-grow to 1 and flex-shrink to 4

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2891

6.8.10.1 #Flex - Size - 1:4 - sm .fls-sm-1-4

Sets flex-grow to 1 and flex-shrink to 4 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-1-4

Sets flex-grow to 1 and flex-shrink to 4 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4938

6.8.11 #Flex - Size - 2:0 .fls-2-0

Sets flex-grow to 2 and flex-shrink to 0.

Examples

Default styling

A div

B div

C div

.fls-2-0

Sets flex-grow to 2 and flex-shrink to 0

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2908

6.8.11.1 #Flex - Size - 2:0 - sm .fls-sm-2-0

Sets flex-grow to 2 and flex-shrink to 0 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-2-0

Sets flex-grow to 2 and flex-shrink to 0 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4955

6.8.12 #Flex - Size - 2:1 .fls-2-1

Sets flex-grow to 2 and flex-shrink to 1.

Examples

Default styling

A div

B div

C div

.fls-2-1

Sets flex-grow to 2 and flex-shrink to 1

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2925

6.8.12.1 #Flex - Size - 2:1 - sm .fls-sm-2-1

Sets flex-grow to 2 and flex-shrink to 1 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-2-1

Sets flex-grow to 2 and flex-shrink to 1 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4972

6.8.13 #Flex - Size - 2:2 .fls-2-2

Sets flex-grow to 2 and flex-shrink to 2.

Examples

Default styling

A div

B div

C div

.fls-2-2

Sets flex-grow to 2 and flex-shrink to 2

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2942

6.8.13.1 #Flex - Size - 2:2 - sm .fls-sm-2-2

Sets flex-grow to 2 and flex-shrink to 2 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-2-2

Sets flex-grow to 2 and flex-shrink to 2 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 4989

6.8.14 #Flex - Size - 2:3 .fls-2-3

Sets flex-grow to 2 and flex-shrink to 3.

Examples

Default styling

A div

B div

C div

.fls-2-3

Sets flex-grow to 2 and flex-shrink to 3

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2959

6.8.14.1 #Flex - Size - 2:3 - sm .fls-sm-2-3

Sets flex-grow to 2 and flex-shrink to 3 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-2-3

Sets flex-grow to 2 and flex-shrink to 3 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5006

6.8.15 #Flex - Size - 2:4 .fls-2-4

Sets flex-grow to 2 and flex-shrink to 4.

Examples

Default styling

A div

B div

C div

.fls-2-4

Sets flex-grow to 2 and flex-shrink to 4

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2976

6.8.15.1 #Flex - Size - 2:4 - sm .fls-sm-2-4

Sets flex-grow to 2 and flex-shrink to 4 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-2-4

Sets flex-grow to 2 and flex-shrink to 4 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5023

6.8.16 #Flex - Size - 3:0 .fls-3-0

Sets flex-grow to 3 and flex-shrink to 0.

Examples

Default styling

A div

B div

C div

.fls-3-0

Sets flex-grow to 3 and flex-shrink to 0

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 2993

6.8.16.1 #Flex - Size - 3:0 - sm .fls-sm-3-0

Sets flex-grow to 3 and flex-shrink to 0 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-3-0

Sets flex-grow to 3 and flex-shrink to 0 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5040

6.8.17 #Flex - Size - 3:1 .fls-3-1

Sets flex-grow to 3 and flex-shrink to 1.

Examples

Default styling

A div

B div

C div

.fls-3-1

Sets flex-grow to 3 and flex-shrink to 1

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3010

6.8.17.1 #Flex - Size - 3:1 - sm .fls-sm-3-1

Sets flex-grow to 3 and flex-shrink to 1 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-3-1

Sets flex-grow to 3 and flex-shrink to 1 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5057

6.8.18 #Flex - Size - 3:2 .fls-3-2

Sets flex-grow to 3 and flex-shrink to 2.

Examples

Default styling

A div

B div

C div

.fls-3-2

Sets flex-grow to 3 and flex-shrink to 2

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3027

6.8.18.1 #Flex - Size - 3:2 - sm .fls-sm-3-2

Sets flex-grow to 3 and flex-shrink to 2 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-3-2

Sets flex-grow to 3 and flex-shrink to 2 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5074

6.8.19 #Flex - Size - 3:3 .fls-3-3

Sets flex-grow to 3 and flex-shrink to 3.

Examples

Default styling

A div

B div

C div

.fls-3-3

Sets flex-grow to 3 and flex-shrink to 3

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3044

6.8.19.1 #Flex - Size - 3:3 - sm .fls-sm-3-3

Sets flex-grow to 3 and flex-shrink to 3 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-3-3

Sets flex-grow to 3 and flex-shrink to 3 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5091

6.8.20 #Flex - Size - 3:4 .fls-3-4

Sets flex-grow to 3 and flex-shrink to 4.

Examples

Default styling

A div

B div

C div

.fls-3-4

Sets flex-grow to 3 and flex-shrink to 4

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3061

6.8.20.1 #Flex - Size - 3:4 - sm .fls-sm-3-4

Sets flex-grow to 3 and flex-shrink to 4 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-3-4

Sets flex-grow to 3 and flex-shrink to 4 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5108

6.8.21 #Flex - Size - 4:0 .fls-4-0

Sets flex-grow to 4 and flex-shrink to 0.

Examples

Default styling

A div

B div

C div

.fls-4-0

Sets flex-grow to 4 and flex-shrink to 0

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3078

6.8.21.1 #Flex - Size - 4:0 - sm .fls-sm-4-0

Sets flex-grow to 4 and flex-shrink to 0 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-4-0

Sets flex-grow to 4 and flex-shrink to 0 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5125

6.8.22 #Flex - Size - 4:1 .fls-4-1

Sets flex-grow to 4 and flex-shrink to 1.

Examples

Default styling

A div

B div

C div

.fls-4-1

Sets flex-grow to 4 and flex-shrink to 1

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3095

6.8.22.1 #Flex - Size - 4:1 - sm .fls-sm-4-1

Sets flex-grow to 4 and flex-shrink to 1 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-4-1

Sets flex-grow to 4 and flex-shrink to 1 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5142

6.8.23 #Flex - Size - 4:2 .fls-4-2

Sets flex-grow to 4 and flex-shrink to 2.

Examples

Default styling

A div

B div

C div

.fls-4-2

Sets flex-grow to 4 and flex-shrink to 2

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3112

6.8.23.1 #Flex - Size - 4:2 - sm .fls-sm-4-2

Sets flex-grow to 4 and flex-shrink to 2 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-4-2

Sets flex-grow to 4 and flex-shrink to 2 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5159

6.8.24 #Flex - Size - 4:3 .fls-4-3

Sets flex-grow to 4 and flex-shrink to 3.

Examples

Default styling

A div

B div

C div

.fls-4-3

Sets flex-grow to 4 and flex-shrink to 3

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3129

6.8.24.1 #Flex - Size - 4:3 - sm .fls-sm-4-3

Sets flex-grow to 4 and flex-shrink to 3 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-4-3

Sets flex-grow to 4 and flex-shrink to 3 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5176

6.8.25 #Flex - Size - 4:4 .fls-4-4

Sets flex-grow to 4 and flex-shrink to 4.

Examples

Default styling

A div

B div

C div

.fls-4-4

Sets flex-grow to 4 and flex-shrink to 4

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 3146

6.8.25.1 #Flex - Size - 4:4 - sm .fls-sm-4-4

Sets flex-grow to 4 and flex-shrink to 4 on sm.

Examples

Default styling

A div

B div

C div

.fls-sm-4-4

Sets flex-grow to 4 and flex-shrink to 4 on sm

A div

B div

C div

Markup

<div class="fld-row"><div class="[modifier class]">A div</div><div class="[modifier class]">B div</div><div class="[modifier class]">C div</div></div>

Source: dist/standard/standard.css, line 5193

6.9 #Flex - Wrap Flex Wrap

Classes for setting the flex-wrap property on an element. Use of this with flex gaps is not recommended.

Source: dist/standard/standard.css, line 3362

6.9.1 #Flex - Wrap - nowrap .flw-nowrap

Sets flex-wrap to nowrap.

Examples

Default styling

A div

B div

C div

.flw-nowrap

Sets flex-wrap to nowrap

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3369

6.9.2 #Flex - Wrap - unset .flw-unset

Sets flex-wrap to unset.

Examples

Default styling

A div

B div

C div

.flw-unset

Sets flex-wrap to unset

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3417

6.9.3 #Flex - Wrap - wrap .flw-wrap

Sets flex-wrap to wrap.

Examples

Default styling

A div

B div

C div

.flw-wrap

Sets flex-wrap to wrap

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3385

6.9.4 #Flex - Wrap - wrap-reverse .flw-wrap-reverse

Sets flex-wrap to wrap-reverse.

Examples

Default styling

A div

B div

C div

.flw-wrap-reverse

Sets flex-wrap to wrap-reverse

A div

B div

C div

Markup

<div class="fld-row [modifier class]"><div class="fls-1-1">A div</div><div class="fls-1-1">B div</div><div class="fls-1-1">C div</div></div>

Source: dist/standard/standard.css, line 3401