Using Bootstrap 4 spacing utilities in Bootstrap 3

Submitted by Charles on Fri, 04/05/2019 - 12:40

I've been working on a Drupal 8 Bootstrap 3 site and was wanting to use the spacing utilities that come with Bootstrap 4.

These utilities provide a range of shorthand responsive padding and margin classes:

Assign responsive-friendly margin or padding values to an element or a subset of its sides with shorthand classes. Includes support for individual properties, all properties, and vertical and horizontal properties. Classes are built from a default Sass map ranging from .25rem to 3rem.

I found this SASS implementation for inclusion in a Bootstrap 3 site.

In my case I just ran:

npm install --save spacing-bootstrap-3

And then included it in my sass: @import '../node_modules/spacing-bootstrap-3/spacing';

(Note, your relative path may be different.)