是否可以将HTML元素固定到另一个的底部？

A simple question for a simple problem. I'm working on a way to represent textual documents (such as book pages) with relatively simple HTML underlying them. Each HTML document can display many pages. The biggest problem I've run into is the footer. I want it to be simple, of course; perhaps just a <FOOTER> tag with plain text within it. However, I can't fathom how to force it to stay at the bottom of its page no matter how much text precedes it. Is there any way to pin an HTML element to the bottom of another?

一个简单问题的简单问题。我正在研究一种表示文本文档(例如书页)的方法,其中包含相对简单的HTML。每个HTML文档都可以显示许多页面。我遇到的最大问题是页脚。当然,我希望它很简单;也许只是一个带有纯文本的

Here's an example:

这是一个例子:

http://prog.bhstudios.org/documents.htm

position:relative doesn't work because I don't know where the original position of the footer will be, other than "somewhere within its parent".

position:relative不起作用,因为我不知道页脚的原始位置在哪里,除了“在其父级内的某个地方”。

position:absolute; bottom:0 doesn't work because that's relative to the viewing window's topleftmost position, not to the element's parent

位置:绝对的; bottom:0不起作用,因为它相对于查看窗口的最左侧位置,而不是元素的父级

position:fixed; bottom:0 doesn't work because that takes it out of the flow and 'pins' it to the bottom of the viewing window, completely independent of the element's parent.

位置是:固定; bottom:0不起作用,因为它将其从流中取出并将其“固定”到查看窗口的底部,完全独立于元素的父级。

I want something that works as one would expect float:bottom might work.

我想要一些可以预期漂浮的东西:底部可能有效。

1 个解决方案

#1

I was just working on similar thing:

我只是在做类似的事情:

<div style="position: relative; height: 300px;">
    <h1>some content on top</h1>

    <div style="position: absolute; bottom: 0px; background: #cccccc;">
        this is on bottom!
    </div>
</div>

1 个解决方案

#1

更多相关文章

随机推荐