css - Bootstrap 响应式切割页脚背景

Question

我遇到了一个问题。我使用 Twitter Bootstrap 作为我网站的框架 http://www.bouq.de .现在我启用了响应功能。当我在宽度为 320px 的智能手机上查看网站或将浏览器窗口缩放到较小尺寸时，页脚的背景被裁掉了大约 20px 的边距。但我想让页脚背景以全宽显示。

就像你用 http://twitter.github.com/bootstrap/ 做同样的程序一样它没有将页边距放在页脚背景上。

我现在不太确定怎么做:)

这是我的页脚代码

<footer>
<section class="footer-top">
    <div class="container" >
        <div class="row">
            <div class="span4">
                <div class="bouq-footer-desc-wrapper">
                    <img src="<?php bloginfo( 'template_url' );?>/img/bouq-logo-footer.png" />
                    <p class="bouq-footer-desc">bouq. ist eine kreative Künstlerplattform mit familiärem Charakter, fokussiert auf die Produktion und Vermarktung von anspruchsvoller, elektronischer Musik und der damit verbundenen Kultur.</p>
                </div>
            </div>
            <div class="span4">
                <?php if ( function_exists('dynamic_sidebar')) dynamic_sidebar("footer-left"); ?>
            </div>
            <div class="span4">
                <?php if ( function_exists('dynamic_sidebar')) dynamic_sidebar("footer-right"); ?>
            </div>

        </div>
    </div>
</section>
<section class="footer-bottom">
    <div class="container" >
        <div class="row">
            <div class="span12">
                <div class="law">
                    <a href="/impressum">Impressum</a> | <a href="mailto:info@bouq.de">Kontakt</a> | &copy; bouq. c/o Level Eins <?php the_time('Y') ?> | designed by <a href="http://www.upplex.de" target="_blank" rel="tooltip" data-placement="top" title="Webdesign by upplex.de" >upplex</a>  <p class="pull-right"><a href="#">Nach oben</a></p>
                </div>
            </div>
        </div>
    </div>
</section>

Answer 1

在响应式 CSS upplex-framework-responsive.min.css 的第 964 行，您有以下声明:

  @media (max-width:767px) { body { 
  padding-left: 20px; 
  padding-right: 20px; 
  }}

这会在 body 的任何一侧为 767px 的任何内容提供边距。您需要删除/覆盖它。