ezgrid
v1.1.0
Published
This npm package provides a collection of CSS classes that simplify the process of working with and aligning grids elements easier.
Downloads
6
Maintainers
Readme
EZGrid
This npm package provides a collection of CSS classes that simplify the process of working with and aligning grids elements easier.
Installation
To use this package in your project, you need to have npm (Node Package Manager) installed. Then, simply run the following command in your project directory:
npm install ezgrid
Usage
Once installed, you can include the CSS file in your HTML file by adding the following line to your section:
<link rel="stylesheet" href="./node_modules/ezgrid/dist/ezgrid.min.css">
Grid Alignment Classes
To use the grid alignment classes, follow these steps:
Set the class name ezg on the main container element where you want to apply the grid layout.
For each child element within the main container, use the appropriate alignment classes from the list below:
- ezg-tl for top-left alignment
- ezg-tc for top-center alignment
- ezg-tr for top-right alignment
- ezg-ml for middle-left alignment
- ezg-mr for middle-right alignment
- ezg-bl for bottom-left alignment
- ezg-bc for bottom-center alignment
- ezg-br for bottom-right alignment
Note: No class needs to be specified for middle center alignment (it is by default)
Scroll Bar Class
To show scroll bars for a specific grid element, add the class ez-scroll to that element.
Examples
You can find sample HTML pages showcasing the usage of EZGrid in the examples folder of the package.
Developer Information
This ezgrid package is developed by Mohammed Samiulla Shariff.
For any inquiries or support, drop a mail on [email protected].
Enjoy using EZGrid!