WordPress.org

Forums

How do I change the header padding without changing the footer padding (10 posts)

  1. Tweenman
    Member
    Posted 1 year ago #

    Hello,
    I found a forum link which partially solves my problem using this code:

    #wrapper {
    background: #FCFCFC;
    margin-top: 0px;
    padding: 0 20px;
    }

    How do I change the header padding without changing the footer padding?

  2. WPyogi
    Forum Moderator
    Posted 1 year ago #

    No way to answer CSS questions without seeing your site.

  3. Tweenman
    Member
    Posted 1 year ago #

  4. WPyogi
    Forum Moderator
    Posted 1 year ago #

    What are you trying to do? You can't change the #wrapper padding on only one contained element.

  5. Tweenman
    Member
    Posted 1 year ago #

    I want to remove the white space to the left and right of the header. This works:
    http://www.throwingabrick.com/wordpress/customizing-the-wordpress-twenty-ten-theme.html

    #branding img {
    border-top: none;
    border-bottom: none;
    }
    #header {
    padding: 0 0 0;
    }

    But when the white space on either side of the banner is gone the text in the outer footer widgets is right along the edge of the red background (no padding).

    If this isn't possible, then how to I widen the whole site by about an inch on both side?

  6. esmi
    Forum Moderator
    Posted 1 year ago #

    Try using Firefox with the Firebug add-on for this kind of CSS troubleshooting. Or use whatever developer tool is available in your web browser.

  7. Tweenman
    Member
    Posted 1 year ago #

    I have been using Firebug for the past week, trying this and trying that. Is there a link that explains the basics of
    manipulating the layout?

    Also, Firebug is annoying it's like trying to drive a car while looking through a keyhole. Is there someplace specific I should be looking at through this keyhole?

  8. WPyogi
    Forum Moderator
    Posted 1 year ago #

    Try:

    #wrapper {
        padding: 0 !important;
    }
    
    #footer-widget-area {
       padding: 0 20px;
    }
    
    #footer-widget-area .widget-area {
        width: 210px;
    }
    
    #site-info {
        margin-left: 20px;
    }
  9. Tweenman
    Member
    Posted 1 year ago #

    Thank you. I tried this, but somehow I mangled it:

    #footer-widget-area .widget-area {
    width: 210px;

    Thanks again, this really helps my bearing.

  10. WPyogi
    Forum Moderator
    Posted 1 year ago #

    Looks good to me - what doesn't look right to you? Try clearing your browser cache.

Topic Closed

This topic has been closed to new replies.

About this Topic