WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Twenty Eleven margins in content area (11 posts)

  1. Jess271
    Member
    Posted 2 years ago #

    Am at a loss. Have searched for ways to place an image in the background of the content area in the Twenty Eleven theme that will flow to the edge of the outer container (right against the outer background area), but no matter what css I change, there is always a gap between the image and background area. I almost got it to work at one screen width, but as soon as the screen width changed, the gap reappeared. Have removed the padding and such from almost all the css, but still it doesn't work. Have tried code that supposedly would fix the issue, but it didn't work. Have used Firefox to see what code to change and then changed the code, but still it didn't work. The bloody gap is always there.

    Any assistance would be appreciated.

  2. Andrew
    Forum moderator
    Posted 2 years ago #

    Hi Jess, can you post a link to the webpage at question? Can you also let us know whether you have a Child Theme or are using a Custom-CSS-type plugin?

  3. Jess271
    Member
    Posted 2 years ago #

    The site is http://www.lesliemweller.com/archives/1

    I'm using a child theme to modify the CSS.

  4. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Try adding this to your child CSS:

    #content {
       margin: 10px 0 0 10px !important;
    }

    Adjust the px settings if need be. There are margins set on #content is multiple places -- so it was easier to nix them all using the !important. That may be why you kept getting out foxed by changes you were trying.

  5. Jess271
    Member
    Posted 2 years ago #

    Thanks for the reply. I tried it and it worked for a narrow browser view, but oddly, it caused additional margin in the wide browser view. You can see for yourself by checking the link again.

    This is why it's been maddening.

  6. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Seems to look fine in Firefox, Safari and Chrome on a Mac. Make sure you're clearing your browser cache.

    But you've got some coding errors, so you should look at fixing those - they may be causing problems:

    http://validator.w3.org/check?uri=http%3A%2F%2Fwww.lesliemweller.com%2Farchives%2F1&charset=%28detect+automatically%29&doctype=Inline&group=0

  7. Jess271
    Member
    Posted 2 years ago #

    Thanks for the update. I'm using a PC and both Firefox and Explorer show a wide border to the right of the background image when the browser window is wide. As to the code issues, those seem to be in the theme HTML itself, so I don't know if they can be changed.

  8. WPyogi
    Forum Moderator
    Posted 2 years ago #

    Okay, here's a screenshot of what I see:

    http://awesomescreenshot.com/03btn80a5

    Is that the same - maybe I'm just not getting it - sorry.

    I'll look at the errors now.

  9. WPyogi
    Forum Moderator
    Posted 2 years ago #

    The errors are caused by the facebook plug in and some of the content you've entered. Read the validator carefully as to the content problems - tags in the wrong places, etc. But they probably are not a big problem except maybe in IE -- I don't use it so I can't tell - just that it's very fussy about errors.

  10. Jess271
    Member
    Posted 2 years ago #

    Ah! That did the trick - somehow! An inner page worked, so the issue was the test page didn't have paragraph marks around the word "Test." That prevented it from working. I can't tell you how happy you've made me. Very, very, very nice!

  11. WPyogi
    Forum Moderator
    Posted 2 years ago #

    LOL - well glad it worked...those pesky little details :).

Topic Closed

This topic has been closed to new replies.

About this Topic