The base of any Bootstrap layout is a container class. There are two types of containers you can choose to use. The first is .container-fluid, which is a full-width box and will stretch the layout to fit the entire width of the browser window.
There is some left and right padding added so the content doesn't bump right up against the browser edge:
The second option is the basic .container class, which will have a fixed width based on the size of your device's viewport. There are five different sizes in Bootstrap, with the following width values:
Extra small <544px
Small >544px
Medium >768px
Large >992px
Extra large >1140px
Let's take a look at the markup for both container types. I'll start with the basic .container class:
<div class="container"> ... </div>
That's pretty easy. Now let's look at the code for the fluid container:
<div class="container-fluid"> ... </div>
Again, that is straightforward...