Skip to content

dhemeira/tailwind-bootstrap-grid

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

tailwind-bootstrap-grid

Plugin to add Bootstrap grid classes into your Tailwind project.

Disabling tailwind's .container

To use this plugin, you need to disable tailwind's built-in container class. To do so, add the following into your tailwind config:

/** @type {import('tailwindcss').Config} */
export default {
+  corePlugins: {
+    container: false,
+  },
  // ...
};

Adding the plugin

Import the package and add it to your plugin list:

+ import bsGrid from '@dhemeira/tailwind-bootstrap-grid';

/** @type {import('tailwindcss').Config} */
export default {
  corePlugins: {
    container: false,
  },
  // ...
+  plugins: [bsGrid],
};

Using the plugin

Now you can use .container, .row, .col and .col- classes. You can use them on a specific breakpoint, e.g.: md:col-6. For more information check out Bootstrap v5.3 Grid

Gutter utilities are also available. For more information check out Bootstrap v5.3 Gutters