Strap Template - Dynamic Grid System



The dynamic grid system is the ability to change dynamically the grid size to a 16 columns grid.

Since version 1.2

Deprecated in Bootstrap 5 because they have introduced a new xxl breakpoint


Grid size

This is a configuration that should be used only for Bootstrap 4. In Bootstrap 5, they have introduced a new bigger breakpoint called xxl that makes this configuration obsolete.

The default grid system of bootstrap is based on 12 columns and does not really allow any space for a second sidebar

strap supports a 16 columns grid.

To change the grid size, set the following configuration:

  • The gridColumns number to 16.
  • The Stylesheet to bootstrap.16col.min.css
Be careful

Strap is not controlling this values. If you choose a 16 grid with a bootstrap stylesheet of 12 columns, you may got unwanted behavior.

For the geek

The 16 columns stylesheet set:

  • the xl breakpoint from 1200px to 1280px.
  • the container max width for the xl breakpoint from 1140px to 1280px.

See What are breakpoints ?

Showcase yourself and your brand

Get free news, tips, and tricks
to create a remarkable experience for your readers.

Related HowTo's
Undraw Animating
ComboStrap Styling - How to create and add your own Bootstrap stylesheet

This article shows you how to create and install your own custom Bootstrap Stylesheet to fit your styling needs. This article was written for Bootstrap 4 but the steps should be relatively the same...

Recommended Pages
Undraw My Documents
What are breakpoints ?

A breakpoint allows to created conditional styling / design

Task Runner