固定位置在 Chrome 中不起作用答案

【问题标题】：Position fixed not working in Chrome固定位置在 Chrome 中不起作用
【发布时间】：2013-12-31 03:05:57
【问题描述】：

我将 position:fixed 应用到我的站点页脚，它在 Firefox 中工作，但在 Chrome 中它不是固定底部。你能给我一些建议吗？

.site-footer { 
background-color: #231F20;
padding-top: 20px;
padding-bottom: 30px;
position: fixed;
bottom: 0px;
left: 0px;
right: 0px; 
}

<footer id="test" class="site-footer col-md-12">
    <div class="site-info">
        <div class="col-md-4">
    <a href="/contact" class="btn btn-contact">Contact</a> <a href="#" class="btn btn-about">Terms</a>
    </div>

        <div class="col-md-8">
            Copyright &copy; <?php echo date('Y');?> <a href="<?php bloginfo('url'); ?>" title="<?php bloginfo('name'); ?>"><?php bloginfo('name'); ?></a> - <?php bloginfo('description'); ?>.<br />

        </div>          
    </div><!-- .site-info -->
</footer>

我非常感谢任何帮助。谢谢！

【问题讨论】：

必须是别的东西 - 代码对我来说很好：jsfiddle.net/Uyxk9
我觉得不错jsfiddle.net/K9VvP
我看到你正在使用引导程序，也许引导程序的一种样式上有一个 !important 标记？您可以在元素检查器中查看其中一种样式是否被覆盖。
在 Chrome 中看起来不错。你设置html, body { height: 100%; }了吗？
在 Chrome 中它不是固定在底部，而是在彩色 div 之后固定。

标签： html css wordpress google-chrome twitter-bootstrap

【解决方案1】：

我认为您可能会与引导类发生冲突。也许你可以添加

position: fixed !important;

在 css 中覆盖引导样式

【讨论】：

我添加了 !important，但这并没有解决问题。