How can I change the width of container to 1400px?
Better you should use Bootstrap fluid layout, like:
CSS
.wrapper{
width: 1400px;
margin: 0 auto;
}
HTML
<div class="wrapper">
<div class="container-fluid"></div>
</div>
You can checkout this page to know more about Bootstrap fluid layout - http://www.tutorialrepublic.com/twitter-bootstrap-tutorial/bootstrap-fluid-layout.php
To change the container size from core, you have to declare your bootstrap container variable again, if you use bootstrap scss.
$container-max-widths: ( md: 720px, lg: 960px, xl: 1140px ) ;
If you use bootstrap SASS port you can easily do that by changing _bootstrap-variables.scss
.
In _bootstrap-variables.scss
search for $container-large-desktop
and change its value to (1370px + $grid-gutter-width)
.
Default $grid-gutter-width
is 30 px. You can change it also.
If you change $grid-gutter-width
then change the $container-large-desktop
accordingly to get your container size 1400px.
To know how to work with bootstrap SASS check it out : https://github.com/twbs/bootstrap-sass