如何疊加在背景

Question

頁腳我在構建佈局的過程中，需要頁腳顯示如下：

http://i.stack.imgur.com/V56Hd.png

目前，頁腳只是坐在後臺的內部，而我需要白色的區域然後在頁腳背景之上的內部，如圖：

這裏是我的頁腳代碼：

<footer id="footer"> 

      <div class="container"> 

       <div class="row-fluid"> 

        <div class="column span2"> 
         <h3 class="header"><?php echo $text_information; ?> <i class="icon-caret-down"></i></h3> 
         <ul class="content"> 
          <?php $i=1; foreach ($informations as $information) { ?> 
          <li id="inf<?php echo $i;?>"><a href="<?php echo $information['href']; ?>"><?php echo $information['title']; ?></a></li> 
          <?php $i++; } ?> 
         </ul> 
        </div> 

        <div class="column span2"> 
         <h3 class="header"><?php echo $text_service; ?> <i class="icon-caret-down"></i></h3> 
         <ul class="content"> 
          <li><a href="<?php echo $contact; ?>"><?php echo $text_contact; ?></a></li> 
          <li><a href="<?php echo $return; ?>"><?php echo $text_return; ?></a></li> 
          <li><a href="<?php echo $sitemap; ?>"><?php echo $text_sitemap; ?></a></li> 
         </ul> 
        </div> 

        <!--<div class="column span2"> 
         <h3 class="header"><?php echo $text_extra; ?> <i class="icon-caret-down"></i></h3> 
          <ul class="content"> 
           <li><a href="<?php echo $manufacturer; ?>"><?php echo $text_manufacturer; ?></a></li> 
           <li><a href="<?php echo $voucher; ?>"><?php echo $text_voucher; ?></a></li> 
           <li><a href="<?php echo $affiliate; ?>"><?php echo $text_affiliate; ?></a></li> 
           <li><a href="<?php echo $special; ?>"><?php echo $text_special; ?></a></li> 
          </ul> 
        </div>--> 

        <div class="column span2"> 
         <h3 class="header"><?php echo $text_account; ?> <i class="icon-caret-down"></i></h3> 
          <ul class="content"> 
           <li><a href="<?php echo $account; ?>"><?php echo $text_account; ?></a></li> 
           <li><a href="<?php echo $order; ?>"><?php echo $text_order; ?></a></li> 
           <li class="wishlist-link"><a href="<?php echo $wishlist; ?>"><?php echo $text_wishlist; ?></a></li> 
           <li><a href="<?php echo $newsletter; ?>"><?php echo $text_newsletter; ?></a></li> 
          </ul> 
        </div> 



        <div class="span4"> 
         <?php if($this->config->get('clearshop_status')== 1) { ?> 

          <div class="social"> 

           <h3><?php echo $this->language->get('text_keep_in_touch'); ?></h3> 

           <?php if(($this->config->get('clearshop_facebook_page') != '') && ($this->config->get('clearshop_facebook_icon') == 1)) { ?> 
            <a href="https://facebook.com/<?php echo $this->config->get('clearshop_facebook_page'); ?>" target="_blank"> 
             <i class="icon-facebook-sign"></i> 
            </a> 
           <?php } ?> 
           <?php if(($this->config->get('clearshop_twitter_username') != '') && ($this->config->get('clearshop_twitter_icon') == 1)) { ?> 
            <a href="https://twitter.com/#!/<?php echo $this->config->get('clearshop_twitter_username'); ?>" target="_blank"> 
             <i class="icon-twitter"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_youtube_username') != '') { ?> 
            <a href="https://youtube.com/user/<?php echo $this->config->get('clearshop_youtube_username'); ?>" target="_blank"> 
             <i class="icon-youtube"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_gplus_id') != '') { ?> 
            <a href="https://plus.google.com/u/0/<?php echo $this->config->get('clearshop_gplus_id'); ?>" target="_blank"> 
             <i class="icon-google-plus"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_pinterest_id') != '') { ?> 
            <a href="https://pinterest.com/<?php echo $this->config->get('clearshop_pinterest_id'); ?>" target="_blank"> 
             <i class="icon-pinterest"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_instagram_username') != '') { ?> 
            <a href="https://instagram.com/<?php echo $this->config->get('clearshop_instagram_username'); ?>" target="_blank"> 
             <i class="icon-instagram"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_tumblr_username') != '') { ?> 
            <a href="http://<?php echo $this->config->get('clearshop_tumblr_username'); ?>.tumblr.com" target="_blank"> 
             <i class="icon-tumblr"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_skype_username') != '') { ?> 
            <a href="skype:<?php echo $this->config->get('clearshop_skype_username'); ?>?call" target="_blank"> 
             <i class="icon-skype"></i> 
            </a> 
           <?php } ?> 
           <?php if($this->config->get('clearshop_linkedin_username') != '') { ?> 
            <a href="linkedin:<?php echo $this->config->get('clearshop_linkedin_username'); ?>?call" target="_blank"> 
             <i class="icon-linkedin"></i> 
            </a> 
           <?php } ?> 

          </div> 

          <?php if($this->config->get('clearshop_footer_info_text') != '') { ?> 
           <div class="info"> 
            <?php echo html_entity_decode($this->config->get('clearshop_footer_info_text'), ENT_QUOTES, 'UTF-8');?> 
           </div> 
          <?php } ?> 

         <?php } ?> 
        </div> 

       </div> <!-- .row-fluid --> 

      </div> <!-- .container --> 

     </footer> <!-- #footer --> 

Answer 1

好一兩件事你可以嘗試是z-index的去CSS文件，並寫下

#footer{z-index:9999;} 

，看看是否適合你，你的問題是不夠清楚，但是這是我的理解。