Please don't forget to read Usage part of each element.
Positioning utilities give you the ability to change the position property of an element.
add position relative to element with
is for small-only.
Parent container must be relative (like the columns of gridding by default). If it's not yet the case, you could use
Then you can use any
on the element you wish to apply an absolute position.
To force static positioning for small only:
To force static positioning for medium only:
To position on top of screen:
To position on bottom of screen:
Position fixed on scroll
Add id="jsrs-stickyContainer" on the container where sticky sticks...
Add data-sticky-container="#jsrs-stickyContainer" to content that needs to stick on scroll. Pay attention to use the same value as for the ID.
Use data-sticky-container-breakpoint="medium" if you need sticky things only on medium-up.
to make an element go up 50% of itself.
See also overlap utilities page.
I go up 50% of myself