Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Bootstrap CSS, what is the purpose of the "container" class?

I'm new to bootstrap, and in fact trying to retrofit a website that I didn't design myself. I'm trying to understand the purpose of the "container" class. Is there ever a case in which I would want no containers? How about two of them?

like image 738
composerMike Avatar asked Oct 03 '22 15:10

composerMike


1 Answers

Like always the docs have the answer to such questions:

Containers

Easily center a page's contents by wrapping its contents in a .container. Containers set max-width at various media query breakpoints to match our grid system.

Taking a closer look at the css file, the container element has as set max-width pixel value:

@media (min-width: 992px) {
  .container {
    max-width: 970px;
  }

While .col- (span in v2) have their values set in percentages :

.col-md-1 {
    width: 8.333333333333332%;
  }

Container classes serve as a reference, allowing bootstrap's responsive grid layout to function properly.

like image 147
Patsy Issa Avatar answered Oct 10 '22 02:10

Patsy Issa