After all, the entire civilized world uses the metric system. Wouldn’t a base 10 Bootstrap grid layout system make more logical sense?
Actually, it wouldn’t. And math is the reason why.
Highly composite numbers
In mathematics, the number 12 is known as a superior highly composite number. Along with the numbers 2, 6 and 60, 12 is only one of four superior highly composite numbers below the threshold of one-hundred.
Being highly composite means a number can be divided evenly in many ways — specifically, more ways than any positive whole number that precedes it. For example, you can evenly slice the number 12 in the following ways:
- into twelves
- into sixths
- into thirds
- into quarters
- into halves
In contrast, the number 10 can’t be cut into thirds, nor can it be evenly cut into sixths or quarters.
As it turns out, this divisibility is important in responsive web page design.
Bootstrap then decides whether to lay all of the content across the page from left-to right, or to chop up the content so as to accommodate different device’s viewing windows, i.e. into halves or thirds or quarters. This responsive rendering generates a webpage that effectively uses every pixel on a 4K monitor, but also renders equally handsomely on a medium-sized Android tablet or even the much smaller iPhone 12 mini.
This same logic is behind why Tim Hortons sells donuts by the dozen and not 10 at a time. You can split a dozen donuts evenly between 2, 3, 4, 6 or 12 of your friends. You couldn’t do that with a 10-pack.
Bagels, hours and circles
The explanation as to why the 12-column Bootstrap grid exists also answers other meta-physical questions we often ask ourselves: ‘Why does an hour have 60 minutes?’ or ‘Why are there 360 degrees in a circle?’ Like the number 12, the numbers 60 and 360 are both superior highly composite numbers. The number 60 has 12 different divisors. The number 360 has 24.
So with hours being split into 60 minutes, you can be late to a Zoom call in 12 different ways. If there were 100 minutes in an hour, the number of even splits would only be 9.
There are only 38 highly composite numbers below the one million threshold, including 120, 2520, 5040, 55440 and 720720. Such numbers rarely elbow their way into our everyday vernacular. Certainly, though, the highly composite numbers of 12, 60 and 360 are pervasive in our everyday lives. And the number 12 specifically plays a key role in modern, responsive web site design.