Bootstrap 5 GridLesson 47Free preview

BS5 Grid XLarge

This lesson is part of Bootstrap · All levels

Summary

The extra large (xl) active breakpoint starts at 1200 pixels, intended for large desktop screens. The .col-xl-* class sets the display when the screen width reaches 1200px upwards, while the xl container reaches a maximum width of 1140 pixels. This breakpoint is useful for a dashboard or a wide multi-column layout.

Key points

The active .col-xl-* starts from screen width >=1200px.
Containers on xl have a maximum width of 1140px.
Suitable for dashboards, wide tables, or multi-column grids.
It can be combined with the lower breakpoint to make it fully responsive.
On a screen below 1200px, the xl column follows the breakpoint rule below.

Full lesson

Code examples and quizzes

Full lessons, code examples, and quizzes are available to subscribers. 5 questions.