diff options
| author | Mark Otto <[email protected]> | 2013-09-03 00:55:29 -0700 |
|---|---|---|
| committer | Mark Otto <[email protected]> | 2013-09-03 00:55:29 -0700 |
| commit | 352f5923d768b7bfae0733844a263ad0405eb85e (patch) | |
| tree | 5ccb35ff32bb12dc62d339c5815aa72cb6c4e2a8 | |
| parent | 36afdbcaac504117d515240cc7294c3fcbde4e45 (diff) | |
| parent | a4897aed8889c614778bbfd92db60f5592ecde07 (diff) | |
| download | bootstrap-352f5923d768b7bfae0733844a263ad0405eb85e.tar.xz bootstrap-352f5923d768b7bfae0733844a263ad0405eb85e.zip | |
Merge branch 'master' of github.com:twbs/bootstrap
| -rw-r--r-- | getting-started.html | 24 |
1 files changed, 14 insertions, 10 deletions
diff --git a/getting-started.html b/getting-started.html index c4bb23675..81f043ff2 100644 --- a/getting-started.html +++ b/getting-started.html @@ -269,20 +269,24 @@ bootstrap/ <div class="page-header"> <h1 id="disable-responsive">Disabling responsiveness</h1> </div> - <p class="lead">Don't want your site or application to be scaled on different devices? With a little bit of work, you can disable the responsive features of Bootstrap so that mobile users see your full desktop-version site. Read below or check out <a href="../examples/non-responsive/">the non-responsive example</a>.</p> + <p class="lead">Bootstrap automatically adapts your pages for various screen sizes. + Here's how to disable this feature so your page works like in <a href="../examples/non-responsive/">this non-responsive example</a>.</p> - <h3>Steps to disable responsive views</h3> - <p>To disable responsive features, follow these steps. See it in action in the modified template below.</p> + <h3>Steps to disable page responsiveness</h3> <ol> - <li>Remove (or just don't add) the viewport <code><meta></code> mentioned in <a href="../css/#overview-mobile">the CSS docs</a></li> - <li>Remove the <code>max-width</code> on the <code>.container</code> for all grid tiers with <code>max-width: none !important;</code> and set a regular width like <code>width: 970px;</code>. Be sure that this comes after the default Bootstrap CSS. You can optionally avoid the <code>!important</code> with media queries or some selector-fu.</li> - <li>If using navbars, undo all the navbar collapsing and expanding behavior (this is too much to show here, so peep the example).</li> - <li>For grid layouts, make use of <code>.col-xs-*</code> classes in addition to or in place of the medium/large ones. Don't worry, the extra-small device grid scales up to all resolutions, so you're set there.</li> + <li>Omit the viewport <code><meta></code> mentioned in <a href="../css/#overview-mobile">the CSS docs</a></li> + <li>Remove the <code>max-width</code> on the <code>.container</code> for all grids with <code>max-width: none !important;</code> and set a regular + width, for example <code>width: 970px;</code>. Be sure that this comes after the default Bootstrap CSS. + You can optionally avoid the <code>!important</code> with media queries or some selector-fu.</li> + <li>If using navbars, remove all navbar collapsing and expanding behavior.</li> + <li>For grid layouts, use <code>.col-xs-*</code> classes in addition to, or in place of, the medium/large ones. + Don't worry, the extra-small device grid scales to all resolutions.</li> </ol> - <p>You'll still need Respond.js for IE8 (since our media queries are still there and need to be picked up). This just disables the "mobile site" of Bootstrap.</p> + <p>You'll still need Respond.js for IE8 (since our media queries are still there and need to be processed). + This disables the "mobile site" aspects of Bootstrap.</p> - <h3>Bootstrap template with disabled responsive</h3> - <p>We've taken the above steps and applied them to an example. Read it's source code to see the specific changes called out.</p> + <h3>Bootstrap template with responsiveness disabled</h3> + <p>We've applied these steps to an example. Read its source code to see the specific changes implemented.</p> <p> <a href="../examples/non-responsive/" class="btn btn-primary">View non-responsive example</a> </p> |
