iceiceice
iceiceice

Reputation: 119

Bootstrap has different behavior in plain html and rails

I created a web page using the bootstrap grid. This page is rendered perfectly, as expected, when I just open it with a browser. The container in bootstrap is smaller than the screen, everything is perfect.

BUT, if I render the exact same page as an application.html.erb layout in rails, it always send this message to the browser: @media (min-width: 1200px). This makes my page become a bit bigger than my screen. The rest is fine. Bootstrap works but the container width is too big! In the plain page it is 960px, which is perfect!

Why?

I don't want this to happen! It is really weird. I read some posts where people say it happened to them, but I have the two pages side by side and "inspect element" shows @media (min-width: 1200px) in the css of the "row" class in the rails page and nothing in the other!

I am totally not willing to hack the bootstrap css. I would just like to figure out what is happening and fix it ! I would really like to use it as a stylesheet and not as a gem...

thanks so much in advance!

P.S.: In rails, I copied the bootstrap folder in my /assets/stylesheets/ directory

Upvotes: 0

Views: 118

Answers (2)

Rockbot
Rockbot

Reputation: 973

Maybe the answers to my questions regarding Bootstrap & Rails provide you with some insight:

How to access Bootstrap Files individually

How to pass Bootstrap-Variables in Rails

Upvotes: 1

Paola Cerioli
Paola Cerioli

Reputation: 741

How about adding your own style in the file 'bootstrap_and_overrides.css.less' (or any other you have)? In my own CSS, I have this:

.container {
    width: 960px;
}

and the problem is solved. :)

Upvotes: 1

Related Questions