WordPress.org

Forums

Twenty Eleven
[resolved] Widget Area Wrapping Below Content (9 posts)

  1. sisintl
    Member
    Posted 10 months ago #

    Hello,

    The issue I'm having is the widget area is wrapping below the content when the browser is maximized. The below are the steps I've taken so far:

    1. I created a child theme.
    2. I copied the sidebar-page.php page into the child theme and renamed it sidebar-homepage.php. The reason for this is I need to add code that will only be on the homepage.
    3. When associating the static homepage to sidebar-homepage.php the widget area wraps below the content, even with the browser window maximized.
    4. I made no changes in the css in regards to width or height.

    When you view the homepage at http://www.creativecontainerinc.com you will see what I mean. Also, if you navigate to the other pages the widget area is just fine and yet they are both using the exact same unedited template.

    Any ideas?

    http://wordpress.org/extend/themes/twentyeleven/

  2. Andrew Nevins
    Volunteer Moderator
    Posted 10 months ago #

    In style.css, there's an overriding style which is causing the problem.
    Line 100

    .singular #primary {
     margin: 0;
    }

    If you want to change this, either create a Child Theme or download a Custom Style/CSS plugin.

  3. sisintl
    Member
    Posted 10 months ago #

    Thank you for the reply. As I stated above I am using a child theme but I'm not sure how to adjust that style to put the widget area back where it should.

  4. Andrew Nevins
    Volunteer Moderator
    Posted 10 months ago #

    In your child theme, edit the file style.css.
    Then in the bottom of that file, put

    .singular #primary {
     margin: 0 -26.4% 0 0;
    }
  5. sisintl
    Member
    Posted 10 months ago #

    I added the following to my child theme's style sheet:

    .singular #primary {
    margin: 0 -26.4% 0 0;
    }

    It seemed to put the widget area back where it should but it appears the content is now running below the widget area.

  6. Andrew Nevins
    Volunteer Moderator
    Posted 10 months ago #

    Add

    .singular #content, .left-sidebar.singular #content {
     margin: 0 34% 0 7.6%;
     width: 58.4%;
    }
    
    .singular.page .hentry {
     margin: 0 0 1.625em;
     padding: 0 0 1.625em;
     position: relative;
    }

    There will still be a gap for the article title.

  7. sisintl
    Member
    Posted 10 months ago #

    Thanks this seemed to do the trick.

  8. alchymyth
    The Sweeper & Moderator
    Posted 10 months ago #

    3. When associating the static homepage to sidebar-homepage.php the widget area wraps below the content, even with the browser window maximized.

    you need to manipulate the .singular css body_class() - see my article.

    just changing some css will make the theme erratic when changing the theme layout options.

  9. sisintl
    Member
    Posted 10 months ago #

    @alchymyth

    Thanks, that fixed it and article bookmarked for future reference.

Reply

You must log in to post.

About this Theme

About this Topic