Changing Bootstrap default container width

Question

I want to change bootstrap container default width, which is 1170px.
Is it OK to override settings like this?

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

Is that all I have to actually do?

Answer 1

It is not good to directly edit a compiled (and perhaps minified) CSS file. It's considered a bad practice and should be avoided.

If you want to change the default width you have to recompile your Bootstrap. This depends on how you are currently using Bootstrap; if you are using a CSS preprocessor such as SASS or LESS you can just edit the variables (see variables.less). Otherwise you can go to http://getbootstrap.com/customize/ in order to get a custom build.

If you are not using any preprocessor, you can fiddle with the grid system and the media queries breakpoints.

Answering your question you probably just want to change @container-large-desktop and @screen-lg using a custom build (assuming you are not using a preprocessor).