CSS Skeleton - 如何将内容定位在右栏的底部

标签 css skeleton-css-boilerplate

我正在使用 Skeleton css 样板文件。我有以下 html:

<div class="container">
    <div class="twelve columns">
        some content here...
    </div>
    <div class="four columns">
        some bottomed content here...
    </div>
</div>

我希望右边(四列)与底部对齐。

我尝试了以下方法:

    ...
    <div class="four columns">
        <div style="position:absolute;bottom:0;">
            some bottomed content here...
        </div>
    </div>
    ...

它一直有效直到屏幕的宽度太窄而无法并排放置两列,右列出现在左列下方,这正是我想要的,除了当添加了 position:absolute;bottom:0;,它在第 1 列底部的顶部对齐。

我也试过添加一个 top-margin 和一个 padding-top 但没有效果。

关于如何让它工作的任何想法。

最佳答案

你试过添加这个吗?

<div class="twelve columns clear">
.clear { clear: both;}

关于CSS Skeleton - 如何将内容定位在右栏的底部,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23426280/

相关文章:

html - 如何使用 GetSkeleton 将一个 'div' 居中并使另一个 'div' float ?

html - 响应式导航错误

1003px 宽度基础的 CSS 网格系统

css - 使用骨架框架的媒体查询

css - 部署在服务器上时,Primeng 图标未出现在 IE11 中

html - 在 div 中放置一个按钮

css - 定位一个 div(存在于 jsp 文件的底部)以显示在所有其他 div 之上

html - 如何在响应式骨架中将内容居中放置在 div 中?

php - 如何创建包含链接到 PHP 中不同数组的框的内容页面?

javascript - 当取决于屏幕分辨率时,如何计算每行显示的 div 数量