Question

所以我的application.html.erb文件中有一个非常普通的设置：

<html class="h-100">

 !head, title, scripts, stylesheets removed for this example here on stackoverflow!

<body class="d-flex flex-column h-100">



<!-- Dropdown Structure -->
  <header>

    <%= render 'shared/nav' %>
     <div class="container">
      <%= render partial: 'shared/message' %>
     </div>

  </header>

  <main role="main" class="flex-shrink-0">
      <%= yield %>
  </main>

   <footer class="footer mt-auto py-3">
    <div class="container">
      <h3>hello</h3>
    </div>
  </footer>
</body>

这对我来说很好。但是，页脚不可见！实际上，当我访问页面时，它完全消失了。当我通过开发人员工具检查页脚时，甚至没有在其中列出。

但是出于某些奇怪的原因，页脚变得可见，然后也像通常那样在开发人员工具中列出了页脚。

我最初的想法是由一个旧的scaffold.scss文件引起的，因此我完全删除了该文件，但是根本没有做任何更改。

我没有任何错误。以前从未遇到过此类问题。我已经在app.scss文件中搜索了所有.footer类，body，html或任何其他可能会覆盖自举程序中的css，但找不到任何东西的类（vscode中使用的搜索工具）。

编辑：

似乎我的html和正文的高度仅为760px，但是主要是全角（超过2000px）。

我尝试添加html, body { height: 100%; }，但是即使高度达到了760px，也是如此。这似乎是个问题，因为显示页脚的页面不高于760px。

任何想法可能导致该问题吗？

Answer 1

对于遇到此类问题的任何人：

我只是将几个脚本移至<％= yield％>下。由于某些原因，他们隐藏了我的页脚。其中一个脚本在底部初始化了一个即时聊天栏，我怀疑此特定脚本引起了问题。通过将所有可疑脚本移到主体部分，现在终于呈现了页脚！

主要部分已更新（出于展示目的已删除脚本）

<main role="main" class="flex-shrink-0">
      <%= yield %>

      <script></script>

  </main>

问候！

Rails-引导页脚消失了吗？

1 个答案: