Layout Helper Classes

Position Types

.h-pos-[relative,absolute,fixed, static, sticky]

(with static you can attach the element back to the whole document flow)

Display Behaviour

See helpers/positioning.scss

Hide Elements / Display: None

.h-hide ::: demo

I'm hidden.

:::

Display Helper Classes

.h-block / .h-show 
.h-inline
.h-inline-block
.h-table
.h-table-row
.h-list-item
.h-flex

::: demo

I'm an inline Div. Woah.

I'm an inline Div. Woah.

:::

Clearfix

.h-clear

Floats

.h-float-[left, right]
.h-clear // clears previous float

::: demo

h-float-left

h-float-right

:::

Horizontal Centering

.h-center (Only for block elements with position relative)

::: demo

h-center

:::

Alignment Helper Classes

E.g. for table cells: .h-vertical-align-[top/bottom/center]

For absolute positioned elements: .h-absolute-horizontal-center.h-absolute-vertical-center