【问题标题】:Tricky sticky footer with sidebar带有侧边栏的棘手的粘性页脚
【发布时间】:2013-09-07 04:19:15
【问题描述】:

我希望在带有全高侧边栏的页面内容区域内放置一个粘性页脚。

这是我正在处理的页面的副本: http://www.lavenderstone.co.uk/stackoverflow/

我过去曾多次成功地与http://ryanfait.com/sticky-footer/ 合作过,还有一种使用 %'s 的方法。我遇到的问题的转折是有一个 100% 高度的侧边栏(绿色),我需要内容 div 底部的页脚(橙色)(灰色)。

我不能将页脚 div 放在其父 div 的底部,也不能强制其兄弟的高度为 100% 减去页脚的高度。两种方法都试过了。

我可以将页脚放在页面底部,但这会破坏侧边栏的设计。任何人都可以帮忙吗?我几乎想求助于javascript!

【问题讨论】:

    标签: html css


    【解决方案1】:

    将此样式添加到 content-wrap 元素

    #content-wrap{
        height:100%;
    }
    

    将您的页脚元素放在您的内容元素中并添加此样式;

    #footer{
        position:absolute;
        bottom:0;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2014-12-06
      • 2023-04-02
      • 1970-01-01
      • 2015-08-22
      • 2013-11-19
      • 2011-10-13
      相关资源
      最近更新 更多