Carol Skelly
1 min readDec 5, 2018

--

Hi Jim Verquist, thanks for your response! But, no that’s not a typo. I meant it exactly as written. Resize the viewport in this demo: https://www.codeply.com/go/0jd0RfUGtd, and you’ll see what I mean.

'col-4' will NOT stack vertically

'col-sm-4' will stack vertically at width < `sm`

When I said,

“Columns will stack vertically (and become full-width) at the smaller screen widths unless you use a specific col-* class in your HTML markup. Use a specific col-* to prevent that vertical stacking.” Notice, I didn’t say use col-sm-* or col-md-*, I said use col-*.

I’m not taking about auto-layout columns. I’m referring to the “classic” 12-unit grid.

col-* refers to col-1, col-2, col-3 col-4 etc…

These columns will not stack vertically (A.K.A “prevent that vertical stacking”). This is not col, col-sm, col-md etc…

However, col-(sm|md|lg|xl)-* columns will stack vertically.

As seen in the example, col-sm-4 stacks vertically below sm, while col-4 does not.

--

--