Javascript 页脚定位：页脚不显示在页面底部_Javascript_Jquery_Html_Css_Ruby On Rails

Javascript 页脚定位：页脚不显示在页面底部

javascript jquery html css ruby-on-rails

Javascript 页脚定位：页脚不显示在页面底部,javascript,jquery,html,css,ruby-on-rails,Javascript,Jquery,Html,Css,Ruby On Rails,我试图把我的页脚放在每一页的最底部，但我在这样做时遇到了麻烦。页脚的位置在页面底部的位置很长，但它在页面的中间位置很短，内容很少。我附上了一个样本图像，让你看到它不是在一些页面的底部放置。下面是我的页脚html和css。我尝试使用位置：fixed但这会产生不必要的影响，使页脚始终可见；我只想把它放在每一页的最下面。我怎样才能做到这一点 application.html.erb <body> <div class="clearfix"> <%=

我试图把我的页脚放在每一页的最底部，但我在这样做时遇到了麻烦。页脚的位置在页面底部的位置很长，但它在页面的中间位置很短，内容很少。我附上了一个样本图像，让你看到它不是在一些页面的底部放置。下面是我的页脚html和css。我尝试使用

位置：fixed但这会产生不必要的影响，使页脚始终可见；我只想把它放在每一页的最下面。我怎样才能做到这一点
application.html.erb
<body>
    <div class="clearfix">
        <%= render :partial => 'layouts/header' %>
        <div id="flash_messages">
            <%- flash.each do |name, msg| -%>
            <%= content_tag :div, msg, :id => "flash_#{name}" if msg && !msg.empty? %>
            <%- end -%>
        </div>
        <%= content_tag(:div, "&nbsp;", :class => "clear") unless flash.empty? %>
        <%= yield %>
        <footer>
            <%= render :partial => 'layouts/footer' %>
        </footer>   
    </div>
</body>

我相信你要找的其实是：
#footer {
    position: fixed;
    clear: both;
    bottom: 0;
    width: 100%;
    background-color: #dddfe1;
}

旁注：要获得一个页脚的多浏览器解决方案，您将面临固有的困难（特别是如果您计划支持移动设备的话），因此研究这个主题可能会非常有成效
另外，这不是一个javascript或jquery问题，不要太挑剔，但请只添加与实际实现相关的标记。
不要太挑剔，但如果您阅读了我的问题，我已经声明我不希望位置：固定；带来了。我很抱歉，这应该是位置：绝对；编辑：你实际上需要金彻在下面提供的东西，如果你没有的话，顺便提一下。位置：相对位置；为位置设置不同的坐标系：绝对坐标系；在上面操作也不能解决最初的问题。页脚停留在页面的中间，页面内容很少，由于某种原因不下移。它还将页脚放在中间，用于大的、可滚动的页面。页脚停留在中间，内容很少的页面。这解决了小内容页面的问题，但是对于需要滚动到页脚的大页面来说，现在看起来不太好。位置会发生什么：绝对；页脚放在“可见”页面的底部；向下滚动时，页脚将停留在那里，覆盖页面内容！对于长页面，它不再位于最底部。@不要忘记添加位置：相对发送给家长！好吧，我确实让它部分工作了。然而，页脚现在覆盖了重要的边栏内容。这是不可接受的，因为它在我的网站上隐藏了很多有用的注意事项，即页脚只是覆盖了它下面的元素。
.clearfix {
    position: relative;
    min-height: 100%;
}

footer {
    position: absolute;
    bottom: 0;
}

#footer {
    position: fixed;
    clear: both;
    bottom: 0;
    width: 100%;
    background-color: #dddfe1;
}