Heroku production differing from local development (Rails)

Question

I'm new to coding and to Rails and I've run into this issue for the first time - the local development version of my app is differing in a detrimental way from the production version.

I'm using Zurb Foundation on my Rails app and deploying to Heroku to see it in production.The issue that I am facing is that locally, the CSS I wrote to get the padding between the navbar and the rest of the page is working correctly, but when I deploy to Heroku the CSS is not rendering correctly and the padding is missing.

I wrapped the yield in application.html.erb with a div of a class I named "fixednavbar" and wrote the following css:

.fixednavbar {
padding-top: 60px;
}

I put this css in a layouts.css.scss file in the asset pipeline (Rails 3.2.13). The code in the application.html.erb file is as follows:

<div class="row fixednavbar">
   <%= yield %>
</div>

I have checked the code locally and on github to make sure they match up and they do. I took a drastic step and started a new repository, then removed the local git repository and started a new one and pushed all the current files there (I created a new repository on github so that all of my previous versions are still in the original repository).

After doing this, I created a new Heroku app and deployed and still the production version is not rendering the CSS the same as the development version.

I'm at a complete loss as to why these versions would differ when the code is the same (unless there is something lurking somewhere else that I have not thought to check).

Any and all help is much appreciated. As I said, I'm knew to Rails (and coding for the most part) and this is the first time I've run into an issue like this.

Thank you!

Update: I have continued to try to sort this out. I did other work on the application and then came back to this issue. I want to get the production version to reflect what is in development, so any help at all would be amazing.

To describe the issue further: It is almost as if my production deployment to Heroku is stuck in an old version of the app when the css wasn't worked out yet. The navbar color is stuck on the first color I changed it to and will not update to the new color. The sticky nav is still causing an issue in production where the body is partially hidden behind the nav.

Now, in development running the local server, I have fixed all these issues. The changes are reflected in development and everything is as it is intended to be.

After the changes, I commit to the git, then I push to github. After pushing to github, I push to Heroku.

The github files reflect the changes and the code is as it should be. Still, Heroku is not reflecting this.. I'm honestly stumped here and need some help please.

Answer 1

With some help from the users who responded, I was able to identify the error and search for the solution. I found it HERE.

The solution is to look in the production.rb file and find the line where it says

config.assets.compile = false

and change "false" to true.

config.assets.compile = true

Then run

rake assets:precompile RAILS_ENV='production'

After deploying to Heroku, you may need to run

heroku run rake db:migrate

This got everything working correctly upon deployment to Heroku.