Bootstrap 5 UI Tutorial

Build fast, responsive sites with Bootstrap 5

Chapter Quiz Exercises
Course Topics
BS5 Get Started BS5 Containers BS5 Grid Basic BS5 Typography BS5 Colors BS5 Tables BS5 Images BS5 Alerts BS5 Buttons BS5 Button Groups BS5 Badges BS5 Progress Bars BS5 Spinners BS5 Pagination BS5 List Groups BS5 Cards BS5 Dropdowns BS5 Collapse BS5 Navs BS5 Navbar BS5 Carousel BS5 Modal BS5 Forms BS5 Input Groups BS5 Floating Labels BS5 Form Validation BS5 Grid System BS5 Dark Mode BS5 Flex BS5 Utilities

BS5 Containers

Bootstrap 5 Containers

Containers are the most basic layout element in Bootstrap and are required when using our default grid system.

Bootstrap 5 requires a containing element to wrap site contents.

Two Container Classes:

  • .container class provides a responsive fixed width container
  • .container-fluid class provides a full width container, spanning the entire width of the viewport

Try It Yourself

Edit the code below and click Run to see the result live.

Source Code
Result
Topics
BS5 Get Started BS5 Containers BS5 Grid Basic BS5 Typography BS5 Colors BS5 Tables BS5 Images BS5 Alerts BS5 Buttons BS5 Button Groups BS5 Badges BS5 Progress Bars BS5 Spinners BS5 Pagination BS5 List Groups BS5 Cards BS5 Dropdowns BS5 Collapse BS5 Navs BS5 Navbar BS5 Carousel BS5 Modal BS5 Forms BS5 Input Groups BS5 Floating Labels BS5 Form Validation BS5 Grid System BS5 Dark Mode BS5 Flex BS5 Utilities