I am attempting to contribute to a rails app which has the following in the gemfile:
gem 'bootstrap-sass', '~> 2.3.2.2'
gem 'sass-rails', '>= 3.2'
It seems like everything works correctly in my layouts with the exception of columns:
<div class="col-md-6">
has no effect whatsoever on the content that it wraps.
However, if I add this line:
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />
To my <head>
, the <div class="col-md-6">
works perfectly but several other bootstrap classes don't work, specifically around the navbar
I have in place.
How can I get the effect of the above div class without including the following line?
<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" />
Your problem is that your gemfile defines: bootstrap 2.3.2.2, and you are using syntax for bootstrap 3.0.0. Note that the specifier ~> has a special meaning, best shown by example: ~> 2.3.2.2 is identical to >= 2.3.2.2 and < 2.4 (more info here).
CSS overrides anything that was written "before" the latest lines, so when you add the link in your layout, the CSS for bootstrap 3.0.0 overrides anything in your assets pipeline. Everything that continues working in your web app was simply not changed between these versions, everything that stops working was changed.
You can get what you want by using the syntax from the boostrap 2.3.2 refences guide. You will find the default grid system under the scaffolding link.