how to size a container in bootstrap code example
Example 1: bootstrap responsive resolutions
// Extra small devices (portrait phones, less than 576px)
@media (max-width: 575.98px) { ... }
// Small devices (landscape phones, 576px and up)
@media (min-width: 576px) and (max-width: 767.98px) { ... }
// Medium devices (tablets, 768px and up)
@media (min-width: 768px) and (max-width: 991.98px) { ... }
// Large devices (desktops, 992px and up)
@media (min-width: 992px) and (max-width: 1199.98px) { ... }
// Extra large devices (large desktops, 1200px and up)
@media (min-width: 1200px) { ... }
Example 2: bootstrap container width
--------------------------------------------------------------------------------------
Bootstrap Container Width | Size | Class Prefix
--------------------------------------------------------------------------------------
Extra small devices Phones (less than 768px) | None (auto) | .col-xs-
Small devices Tablets (greater than equals 768px) | 750px | .col-sm-
Medium devices Desktops (greater than equals 992px) | 970px | .col-md-
Large devices Desktops (greater than equals 1200px) | 1170px | .col-lg-