css - 将一个 div 放在另一个 div 的底部

Question

我正在尝试进行 jquery 分页，但是我在将导航器保持在底部时遇到问题，即使使用clear: both.

问题是导航 div<div class="alt_page_navigation"></div>必须在</ul>结束的地方并且不能在另一个 div 中，否则分页会被破坏。

另一个问题是因为页面是动态的，所以我不知道alt_page_navigation事先的宽度。

这是一个实时页面示例，我已经尝试了谷歌吐出的所有内容，但无济于事。如果有人知道一个简单的解决方案，请告诉我:)

谢谢 ：））

Answer 1

Clear 不适用于您的内联块显示，但您需要它来居中。

试试这个解决方案来创建一个清除 div，然后把

<div class="clearfix"></div>

在您的产品和寻呼机之间。

Answer 2

将填充放在等于导航高度的底部，并像这样定位：

.wrapper { position:relative; padding-bottom:1.5em }
.nav     { height:1.5em; position:absolute; bottom:0 }

例如：http: //jsfiddle.net/CwrMq/

---

但是也没有理由使用绝对定位；让它成为一个合适的display:block项目。例如：http: //jsfiddle.net/CwrMq/1/

Answer 3

你的.alt_page_navigationdiv 已经display: inline-block设置好了。如果您在 css 中删除此行 - 您的 div 将清除浮动。如果您希望它的内容位于页面的中心，只需添加text-align: center它并确保其内容是inline-block（现在您a是块级的）。您可以在此处查看工作示例：http: //jsfiddle.net/6FNH6/

Answer 4

这是我倾向于在这种情况下使用的解决方案。

您的分页器需要进入水平放置的容器内

看到这个小提琴 - http://jsfiddle.net/94MwF/1/

基本上，您使用 text-align 将其水平居中，并将 absolute 放置在底部。