1

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

就像你用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>

4

2 回答 2

1

On line 964 in your responsive CSS, upplex-framework-responsive.min.css, you have the following declaration:

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

This is giving anything from 767px a margin on either side of the body. You need to remove/override this.

于 2012-09-27T00:02:59.080 回答
0

好的,我修好了:)

 footer,   .page-title-container {
    margin-left: -20px;
    margin-right: -20px;   }

.page-title-container-wrapper,   .bouq-footer-ext {     padding: 0px 10px 0px 10px;   }

只需在第二个包装器中添加填充

于 2012-09-27T01:29:02.440 回答