Bootstrap 3 – Set Container Width to 940px Maximum for Desktops?

by

There is a far easier solution (IMO) in Bootstrap 3 that does not require you to compile any custom LESS. You just have to leverage the cascade in “Cascading Style Sheets.”

Set up your CSS loading like so…

<link type="text/css" rel="stylesheet" href="https://stackoverflow.com/css/bootstrap.css" />
<link type="text/css" rel="stylesheet" href="http://stackoverflow.com/css/custom.css" />

Where /css/custom.css is your unique style definitions. Inside that file, add the following definition…

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

This will override Bootstrap’s default width: 1170px setting when the viewport is 1200px or bigger.

Tested in Bootstrap 3.0.2

Leave a Comment