Why i can't disable responsive bootstrap in my project

Question

I have a big problem. I use bootstrap ver 3.1.1 in my website, and i want disable responsive of bootstrap in this project, but i can't!

This is html:

<div class="container">
            <div class="row">
                <div class="col-md-9" style="background-color: yellow;">col left</div>
                <div class="col-md-3" style="background-color: pink;">col right</div>
            </div>
        </div>

This is my custom css:

body {
    background-color:#fdfdfd !important;
    font-family:Arial, Tahoma !important;
    min-width: 1024px !important;
}
.container {
    max-width: none !important;
    width:1024px !important;
    background-color:#fff !important;
}

remove meta tag in header page

<meta name="viewport" content="width=device-width, initial-scale=1">

but when i test my web in firefox, chrome... element div 'container' is fixed size when i resize width of brower. But navbar-menu, gird system is responsive. Why? Please help me.

Sorry because my english is not good!

Thank you very much!

possible duplicate of [How to remove responsive features in Twitter Bootstrap 3?](http://stackoverflow.com/questions/17935601/how-to-remove-responsive-features-in-twitter-bootstrap-3) — Mr. Alien, Feb 25 '14 at 10:50

l2aelba · Answer 1 · 2014-03-12T07:07:53.477

2

Build you custom :

http://getbootstrap.com/customize/

(Uncheck that Responsive utilities checkbox)

edited Mar 12 '14 at 07:07

answered Feb 25 '14 at 10:52

l2aelba

21,591
22
102
138

I'm try it, but navbar is responsive when resize brower. I don't why :( – Thuy.VoKhanh Feb 26 '14 at 03:00

score 0 · Answer 2 · answered Feb 25 '14 at 10:53

From the Docs

Omit the viewport <meta> mentioned in the CSS docs
Override the width on the .container for each grid tier with a single width, for example width: 970px !important; Be sure that this comes after the default Bootstrap CSS. You can optionally avoid the !important with media queries or some selector-fu.
If using navbars, remove all navbar collapsing and expanding behavior.
For grid layouts, use .col-xs-* classes in addition to, or in place of, the medium/large ones. Don't worry, the extra-small device grid scales to all resolutions.

Do you have any example about "If using navbars, remove all navbar collapsing and expanding behavior". I don't understand about this. Thanks @dotty! — Thuy.VoKhanh, Feb 26 '14 at 02:35

score 0 · Accepted Answer · answered Feb 25 '14 at 11:12

0

You can disable responsiveness of bootstrap by including non-responsive.css.

For more details on it see official documentation.

answered Feb 25 '14 at 11:12

Alt-Rock Ninja

356
2
8

Why i can't disable responsive bootstrap in my project

3 Answers3