【问题标题】:Error in generic twitter bootstrap sticky-footer-with-navbar example?通用 twitter bootstrap sticky-footer-with-navbar 示例中的错误?
【发布时间】:2013-05-29 04:26:34
【问题描述】:

我正在尝试在引导程序中创建一个粘性页脚,并使用此处提供的默认模板:http://twitter.github.io/bootstrap/examples/sticky-footer-navbar.html

提供的示例似乎有问题;当通过较小的分辨率查看页面时,导航栏会折叠(应该如此),但是最初阻止内容隐藏在导航栏下的 60 像素填充会在导航栏和内容之间产生很大的间隙。

有什么想法吗?

谢谢

【问题讨论】:

    标签: css twitter-bootstrap responsive-design navbar


    【解决方案1】:

    更改此行为的一种简单方法是在导航栏折叠时移除 60 像素的填充。像这样的东西应该可以解决问题:

    @media (max-width: 979px) {
    
    #wrap > .container {
    padding-top: 0;
    }
    
    }
    

    您可能必须更改 div 名称以匹配您的命名。

    祝你好运!

    【讨论】:

      【解决方案2】:

      应该是这样

      #push, #footer {
      min-height: 60px;
      }
      

      而不仅仅是高度

      【讨论】:

      • 对不起,我完全误读了这个问题。当我看到页脚没有与浏览器底部齐平时,我分心了
      • 填充不应基于主要内容。导航栏应该有一个浮动 div 来固定两个内容之间的大小。
      • "浮动 div about" *about = above >
      猜你喜欢
      相关资源
      最近更新 更多
      热门标签