In Bootstrap, column span is specified for different display sizes.
For example, col-md-4 will set the column span to 4 only for sizes MD (medium, laptop) and above. On smaller screens the column will span through the whole row. See below, the left screen is small (768px) and the right is medium (1024px):
Having columns behave differently on different screen sizes makes it easy to create responsive grids with Bootstrap.
All you have to do is specify span for those screen sizes that will have different versions of the layout. For example, if we want to have full-width columns on mobile, show two columns per row on tablets and three per row on all other sizes, we would set columns layout properties like this (span SM to 6, MD to 4):
Last updated on October 26, 2015 at 4:35 pm