title: CSS - footer with the top image
body: <p>I have my <code>html5</code> <code>footer</code> element on the bottom of my page and I want to set a background image on top of my <code>footer</code>.</p>
  
  <p>I add the following CSS:</p>
  
  <pre><code>footer {
    background: #333333 url("footer_top.png") 50% 0 no-repeat;
    padding-top: 110px; # the image has 110px height
  }
  </code></pre>
  
  <p>It works, however I get the problem of background-color (<code>#33333</code>) filling the space on the <code>right</code> and on the <code>left</code> of my centered background footer image, and what I want is to have the image absolutely on the <code>top</code> of the box with <b>no</b> footer background on either the left or the right.</p>
  
  <p>Any help would be appreciated!   </p>