Layout System

Group of functions and mixins related to layout positioning.

Sipster’s Layout System is a group of functions and mixins that together allow for the correct distribution and positioning of elements in space. To do so, Sipster replaces native flex and grid properties with easy-to-apply mixins that can be used anywhere in the code.

This Layout System has other functionalities as well. A standard system for screen breakpoints allows you to have a complete control over an element's position on different screen devices. For developers needing to overlay elements, Sipster has a quick access function to the z-index property, adding to it a semantic terminology that will facilitate the track of the different layers.

Layout System Index

Breakpoints & Grid SystemZ-index & LayeringSpacingFlexboxCSS Grid