Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to choose the container 960px wide and not to 1200px in Bootstrap

How to choose the container 960px wide and not to 1200px in Bootstrap?

like image 526
Marco Gurnari Avatar asked Dec 20 '12 20:12

Marco Gurnari


People also ask

Which Bootstrap class takes full width container?

The .container-fluid class provides a full width container, spanning the entire width of the viewport.


3 Answers

Bootstrap sets container width to 1170px on screens wider than 1200px.
For screens from 992px to 1200px width of container is set to 970px. You can read more about bootstrap's grid here
Now if you want to set container to 760px for large screens, you have to locate this and edit in bootstrap.css or add this code to your custom css:

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

and

@media (min-width: 992px) {
  .container {
    width: 960px;
   }
 }

Hope this helps

like image 187
calofanas Avatar answered Sep 20 '22 11:09

calofanas


Do you just want a fixed width website? If so then then just don't include bootstrap-responsive.css. The default width for a fixed width container will be 960px.

Otherwise if you still want the responsive features but no 1200px container you will need to customize your bootstrap install. To do that:

  • Go to http://twitter.github.com/bootstrap/customize.html
  • Under the responsive section uncheck "Large desktops (>1200px)"
  • At the bottom of the page Click "customize and download" to get your custom bootstrap
like image 42
hajpoj Avatar answered Sep 22 '22 11:09

hajpoj


This works for me.

!important is not recommended to use. but you can try.

.container, .container-fluid{
 width: 960px !important;
}
like image 37
Surinder ツ Avatar answered Sep 21 '22 11:09

Surinder ツ