tailwind-flex-grid
v1.0.0
Published
Tailwind CSS Bootstrap 4 like columns plugin
Downloads
382
Maintainers
Readme
tailwind-flex-columns
Tailwind CSS Bootstrap 4 like columns plugin
Flexbox grid
It exposes three configuration options:
columns
, for specifying all of the column sizes you'd like to generategutter
, for specifying the gutter the the row and columnnsvariants
, for specifying which variants to generate
module.exports = {
// ...
plugins: [
// ...
require('./path/to/plugin-file')({
grids: [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12],
gutter: 30,
variants: ['responsive'],
}),
],
}
With zero configuration, it will generate a row class, 1 to 12 columns, offsets, column ordering and responsive
variants for each new utility.
The plugin generates the following sets of classes:
.row
, for settingdisplay: flex
andflex-wrap: wrap
on an element.col-{size}
, for specifying the number of columns in the grid.order-first
, for placing the element first in the row.order-last
, for placing the element last in the row.order-{size}
, for placing the element at specific places in the row.offset-{size}
, for the margin-left offset for the element