Blaze UI Grid Offsets

Blaze UI is an open-source CSS framework. It is a lightweight UI toolkit that provides great tools for building customized and scalable applications. It can work with any framework that exists. It can adapt to any ecosystem. All designs or CSS are mobile-first and hence responsive. 

Blaze UI containers provide a media screen of different widths to put the content inside it according to different requirements. Use the o-grid__cell--offset-xx class to push a cell horizontally across the grid. 

Blaze UI Containers offsets classes:

• .o-grid__cell--offset-xx: This class is used to set the offset of the container grid. In this class, xx represents the size of the container width.

Syntax:

<div class="o-grid o-grid--demo">
 ...
 <div class="o-grid__cell o-grid__cell--width-xx 
 o-grid__cell--offset-xx">
 ...
 </div>
</div>

Example: The following code demonstrates the o-grid__cell--offset-xx class using offset as 40.

Output:

👁 Image

Reference: https://www.blazeui.com/objects/grid/