For reasons I don't know, Bootstrap's container class has a fixed-width for the xs, sm, md and lg breakpoints.
Presumably it is so that the developer can plan for the exact width available at each breakpoint. This doesn't sound very "responsive" to me!
On these smaller screens, this margin space is valuable real estate that should be used instead.
container-fluid is 100% width and is exactly what we need on screen widths less than lg, but on a large display like 1980x1080 pixels it's too wide for most applications.
I usually over-ride Bootstrap's default in my own CSS by adding the following instruction (after Bootstrap's CSS):
@media (max-width:1199px) {
.container{max-width:100%}
}
This simply instructs that on any screen width up to the lg breakpoint, the container should be 100% width.
Update: Bootstrap v4.4.0 introduced responsive containers so this article is only relevant to prior Bootstrap versions.
For v4.4.0 and above, you can use container-fluid container-xl to make containers take up the full browse width up to the xl breakpoint.
For v5, you can use container-fluid container-xxl to make containers take up the full browse width up to the xxl breakpoint.
Thanks Bootstrap developers!