Welcome to the Treehouse Community

Want to collaborate on code errors? Have bugs you need feedback on? Looking for an extra set of eyes on your latest project? Get support with fellow developers, designers, and programmers of all backgrounds and skill levels here with the Treehouse Community! While you're at it, check out some resources Treehouse students have shared here.

Looking to learn something new?

Treehouse offers a seven day free trial for new students. Get access to thousands of hours of content and join thousands of Treehouse students and alumni in the community today.

Start your free trial

Ruby

Posted by Norman Weitzel
Norman Weitzel
8,047 Points

Simple Rails App / Simple Form / Bootstrap

I'm working my way through the "Build a simple Ruby Rails Application" tutorial, and I'm having some issues with getting Simple_Form to apply the proper formatting with Bootstrap v3.

I've seen some recommendations to go back to the older Bootstrap version, but to get that to work you have to go from Rails 4.0.0 back to 3.2.6, and change a lot of things in the gem file.

I've been working on tweeking the simple_form.rb and simple_form_bootstrap.rb initializers, but it's been a slow process of trial, error, and a lot of time in the element inspector.

My Google-Fu hasn't found a fix for this quite yet, so I was wondering...has anybody found a way to make this work that doesn't involve scrapping the project and starting over???

2 Answers

Norman Weitzel
Norman Weitzel
8,047 Points
Norman Weitzel
Norman Weitzel
8,047 Points

So, as it always seems to go, I think I've got at least a start for a fix, and it's not too bad.

++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

1) In config/initalizers/simple_form.rb uncomment and change

config.input_class = nil

to

config.input_class = "form-control"

2) In config/initalizers/simple_form_bootstrap.rb find and replace every instance of 

control-group

to

form-group

3) The last step (that I've found so far) is to update a bit of styling. Bootstrap put a -15 margin on my text area that made everything look a bit wacky, so I overrode that in my application.css file. ++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++++

I've spent just about a full day spinning my wheels on this, breaking stuff, and fixing stuff. I've learned a lot, but I hope this fixes it for me and everyone else that has had this problem!!!!

pat saunders
pat saunders
6,636 Points
pat saunders
pat saunders
6,636 Points

Hey, did you ever find any more steps to solve this issue im having the save problem at the moment