nix

  • Docs
Docs Menu
  • nix
    • Display
    • Flexbox
    • Float
    • Margin
    • Sizing
    • Padding
    • Position
    • Text
    • Others

Position guide

position

CLASSDESCRIPTION
.nix-position_relativeThe element is positioned relative to its normal position
.nix-padding_absoluteThe element is positioned relative to its first positioned (not static) ancestor element
.nix-padding_fixedThe element is positioned relative to the browser window
.nix-padding_staticDefault value. Elements render in order, as they appear in the document flow
.nix-padding_stickyThe element is positioned based on the user's scroll position
<div class="nix-padding-top_5"></div>
xxxxxxxxxx
 
1
<div class="nix-padding-top_5"></div>

Responsive example

CLASSDESCRIPTION
.nix-position_relative--xs--xs suffix only affects device widths of 768px and lower.
.nix-padding_absolute--sm--sm suffix only affects device widths of 1024px and lower.
.nix-padding_fixed--md--md suffix only affects device widths of 1200px and lower.

Contribute on Github! Edit this section.

  • position20 sec read
  • Responsive example11 sec read
    Copy