Support » How-To and Troubleshooting » [Resolved] Twenty eleven child: footer background image (colophon) issue

[Resolved] Twenty eleven child: footer background image (colophon) issue

  • I have a Twentyeleven Child theme

    I am using the 2nd footer widget area to have centered and paragraphed text and I want to have a centered background image to it too.

    The text looks good, but the background image somehow is repeating at each new paragraph.

    This is the code I added:

    #colophon #second .textwidget p {
       text-align: center;
       line-height: 150%;
       background: url(images/footer.png);

    When I add the code
    no-repeat center center fixed to the background property, I also don’t get the result I’m looking for. It then shows the image that starts on the 1st paragraph, and nothing else. So a small ‘bar’ shows behind the 1st paragraph of the centered text.

    I want the image to be centered – you can see the left margin is larger than the right margin.
    And I want the image to show in full.

    I added the image on one of the pages so you can see what the image looks like. http://www.sparklynx.be/preview/demaeyer/?page_id=8

    Would be grateful for any pointers.

Viewing 10 replies - 1 through 10 (of 10 total)
  • esmi


    Forum Moderator

    Try using Firefox with the Firebug add-on for this kind of CSS work.

    Thanks. I was using Chrome, but now checking in Firefox and installed the Firebug add on. I can see it allows to check the css in the web page. But I don’t understand how it is going to help me fix my problem..? Can you please get me started on how to use this?



    Forum Moderator

    not a WordPress problem

    – don’t add the background image to the paragraph tag, but possibly to the .textwidget class

    Hm.. I’ve gond through the doco, and as far as I can see, Firebug helps to check which div or class is affected. But I think I already knew that, I think the class I added the background image to is correct. I think it’s the CSS3 code itself somehow that is causing the incorrect showing of the background image…

    Is my understanding of this correct?

    ahhh.. ok, I just read your comment alchymyth, that makes sense.. going to try that right now, thanks!

    ok that did it.. but I noticed now that my image needs to be resized. It only shows from the middle down.

    Thanks for your support!

    Any ideas on how to calculate the size what the image should be to be fully showing in the widget area..? I’m going to do trial/error but it seems like this could take some time before I get it right.

    You know what, I cried victory too soon…

    Adding the background image to the .textwidget class like this, didn’t fix the issue.

    #colophon #second .textwidget {
          background: url(images/footer.png) no-repeat center;


    Somehow the image is still repeated for each paragraph

    ok never mind, I just realized that I still had the background image code under the paragraph section in the CSS as well – duh.

    on to resizing the image now..

    ok resolved

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘[Resolved] Twenty eleven child: footer background image (colophon) issue’ is closed to new replies.
Skip to toolbar