1.0.1 • Published 2 years ago
tailwind-plugin-grid-areas v1.0.1
tailwind-plugin-grid-areas
A Tailwind CSS plugin to add some basic grid-area support.
Installation
Install the plugin from npm:
npm install tailwind-plugin-grid-area
Then add the plugin to your tailwind.config.js
file:
// tailwind.config.js
module.exports = {
theme: {
// ...
},
plugins: [
require('tailwind-plugin-grid-areas'),
// ...
],
}
Basic usage
Class | Properties |
---|---|
area-1 | grid-area: 1 / 1 |
area-a , area-b , ... area-z | grid-area: [a-z] |
Arbitrary values
See: https://tailwindcss.com/docs/adding-custom-styles#using-arbitrary-values
<div class="area-[foo]">
<!-- ... -->
</div>
<div class="area-[span_3_/_span_some-grid-area]">
<!-- ... -->
</div>