Peter Kazazes
Peter Kazazes

Reputation: 3628

Temporarily Disable Responsiveness Bootstrap

I'm in the middle of developing a page using Twitter Bootstrap. At the current stage of development, changing to a different device resolution other than desktop breaks the layout of the site horribly. How can I disable the responsiveness aspect of bootstrap until I'm ready to develop for it? I'd like to have a desktop version of this site published and I can't if it breaks on different resolutions. I don't have a bootstrap-responsive.css file, it's all baked in to bootstrap.css.

Upvotes: 1

Views: 2807

Answers (1)

Praveen Kumar Purushothaman
Praveen Kumar Purushothaman

Reputation: 167250

Remove Bootstrap Responsive CSS

In your source code, find the style declarations:

<link href="assets/css/bootstrap.css" rel="stylesheet">
<link href="assets/css/bootstrap-responsive.css" rel="stylesheet">

Just remove the second CSS. Have only this:

<link href="assets/css/bootstrap.css" rel="stylesheet">

If all the files are combined...

You need to find and remove the @media queries, responsible for screen widths. Remove all the @media queries, which have:

@media screen and
(min-width: X px) and
(max-width: X px)

@media screen and
(min-device-width: X px) and
(max-device-width: X px)

Upvotes: 1

Related Questions