Explain the container classes in Bootstrap

Beginner

Answer

Bootstrap provides three main container classes:

  1. .container: Fixed-width container with responsive breakpoints

    • Provides max-width at different screen sizes
    • Centers content horizontally
  2. .container-fluid: Full-width container

    • Spans 100% of the viewport width
    • No maximum width restrictions
  3. .container-{breakpoint} (Bootstrap 4+): Responsive containers

    • .container-sm, .container-md, .container-lg, .container-xl, .container-xxl
    • 100% width until specified breakpoint, then behaves like .container