Menü schliessen
Created: June 10th 2025
Last updated: June 10th 2025
Categories: Common Web Development,  CSS,  IT Development
Author: Tim Fürer

Bootstrap: How to only Include Grid System

Tags:  bootstrap,  CSS,  vite,  web
Donation Section: Background
Monero Badge: QR-Code
Monero Badge: Logo Icon Donate with Monero Badge: Logo Text
82uymVXLkvVbB4c4JpTd1tYm1yj1cKPKR2wqmw3XF8YXKTmY7JrTriP4pVwp2EJYBnCFdXhLq4zfFA6ic7VAWCFX5wfQbCC

Bootstrap offers an awesome grid system for layouting web projects but also comes with a ton of other stuff you might not need or want such as normalise styles, components, and compilation via SCSS. Here's how to only include the grid system on its own using vanilla CSS.


Installation

First we have to install Bootstrap. I'd recommend using their npm package as it's easy to update later on:

node.js:

npm install bootstrap

bun:

bun add bootstrap

Import

Now to importing. The file we desire is located at the following path from the root of the Bootstrap package ("node_modules/bootstrap/"): "dist/css/bootstrap.grid.css". Assuming you're running a npm package-compatible bundler (such as Vite), you can insert the following line into your index stylesheet to easily import it:

@import 'bootstrap/dist/css/bootstrap-grid.css';