Component Listing

GRIDS

The grid component offers a grid-based layout system, with rows and columns, making it easier to design web pages without having to use floats and positioning.
To use these grid templates in your project import the below stylesheet.


@import url("https://oxygen-ui-component-library.netlify.app/components/grid/grid.css")

2 Column Grid Layout

This component is used to divide the website into two equal parts.


<div class="grid-container-2">
    <div class="cell-1"></div>
    <div class="cell-2"></div>
</div>

3 Column Grid Layouts

This component is used to divide any component into three equal parts.


<div class="grid-container-3">
    <div class="cell-1"></div>
    <div class="cell-2"></div>
    <div class="cell-3"></div>
</div>