【问题标题】:CSS not working on live heroku website but works on localhostCSS 不能在 live heroku 网站上运行,但可以在 localhost 上运行
【发布时间】:2026-01-26 03:25:01
【问题描述】:

所以我什至不确定要在这里显示什么代码,但我只有一个使用 Foundation 并托管在 Heroku 上的基本 Rails 网站。我的 CSS 和一切工作正常,直到我将更改推送到 Heroku 后突然添加的一件事无法正常工作,但它正在我的本地主机上工作。这是不起作用的 CSS:

.thankyou {
    background-image: url('xxx.jpg');
    background-size:cover;

    a {
        color: white;
        text-decoration: underline;

        &:hover {

        }
    }

    .question-list {
        color: white;
        font-family: Muli;
        text-align: left;
        font-size: 17px !important;

        ul {
            list-style-type: none;

            li {
                font-size: 17px !important;
                line-height: 22px !important;
            }
        }

        p, ol, ul, td {
            font-family: verdana, arial, helvetica, sans-serif;
            font-size: 17px;
            line-height: 22px;
            color:white;
        }
    }
}

这是该部分的 HTML:

<section class="hero thankyou">
  <div class="row">
    <div class="large-12 columns">
      <div class="main-wrapper">
      <h1>Thank you for your interest! </h1>
      <h3 id="putparadise"><em>Check your inbox for the link to the webinar, or click <a href="/">here</a> to return to the home page.</em></h3>

      <hr>
    </div>
  </div>
</div>
<div class="row">
  <div class="large-8 columns webinar-video">
    <div class="black-box-2">
      <h3>6 critical questions that will be addressed in the webinar</h3>
      <div class="row">
        <div class="large-6 columns question-list">
          <ul>
            <li><p><strong>1. Type of title</strong><br> What kind of title are you getting? Is it a Land Title, a Conveyance or A Land Lease?</li></p>
            <li><p><strong>2. Taxation</strong><br> Capital gains taxes? Property taxes?</li></p>
            <li><p><strong>3. Water/Sewer</strong><br> Are the water and sewer regulated or unregulated?</li></p>

          </ul>
        </div>
        <div class="large-6 columns question-list">
          <ul>
            <li><p><strong>4. Ownership Structure</strong><br> Learn about foreign ownership rights. Should you invest in your personal name vs company name vs IBC?</li></p>
            <li><p><strong>5. Vehicle Ownership</strong><br> Can I own a vehicle? Yes... IF your property meets the requirements for vehicle permits.</li></p>
            <li><p><strong>6. IRA/401K Eligibility</strong><br> Learn how you can use your retirement savings/funds to invest in Belize.</li></p>
          </ul>
        </div>
      </div>
    </div>
    </div>
    <div class="large-4 columns sidebar">
      <div class="black-box-3">
        <p><strong>After watching the on-demand webinar, you'll receive an email from us.</strong></p>

        <p>Simply reply to that e-mail if you'd like to receive more information,
          be sure to ask any specific question you have!
          We'll get back to you within 1 working day.</p>        
      </div>
      <div class="row">
        <div class="large-12 followup">
        </div>
      </div>
    </section>

据我所知,heroku 日志中没有明显的错误,但我也不擅长阅读它们,所以如果有人对在哪里查看或可能发生的事情有任何想法,那就太好了!

好的,所以在继续处理该项目后,我发现我为新部分添加的 CSS 也不起作用。当我在项目中的已编译 CSS 文件中搜索“cmd-f”代码时,它不会出现。什么可能导致 css 突然停止编译?

【问题讨论】:

  • 浏览页面源代码时是否正确加载css文件?
  • @MaximeMangel 当我查看实时页面上的已编译 CSS 时,我提到的 CSS 都没有。为什么它不能正确推送到 heroku?
  • 你是用相对路径还是绝对路径来引用你的css文件?
  • 所以我在这里找到了答案:*.com/questions/14697604/… 不确定它的哪一部分解决了问题,但至少它有效!

标签: html css ruby-on-rails heroku zurb-foundation


【解决方案1】:

尝试在终端中运行以下命令

heroku run bundle exec rake assets:precompile

然后重启服务器

heroku restart

【讨论】: