The Github Bootstrap release page shows v4.2.1 was launched on Dec. 21, 2018.

The Bootstrap media queries set width values for the container class as follows:

@media (min-width: 576px) { .container { max-width: 540px; } }
@media (min-width: 768px) { .container { max-width: 720px; } }
@media (min-width: 992px) { .container { max-width: 960px; } }
@media (min-width: 1200px) {.container { max-width: 1140px; } }

When using Bootstrap, these are the widths to keep in mind when creating page layouts for different devices.

According to Statcounter.com, the most frequently used screen resolution used in the world in Dec 2018 was

  • 360 x 640 coming in at 19.42%

The top screen resolutions in the US were

  • 1920 x 1080  –  10.28%
  • 375 x 667  –  9.21%
  • 1366 x 768 –  9.05%
  • 360 x 640  –  8.6%
  • 414 x 736  –  5.67%768 x 1024  –  5.08%

So when planning layouts for different devices, it makes sense to keep a smaller 360 width in mind, unless you are alright with making some users turn their phones horizontal.