Support » Themes and Templates » Widgets on either side of content

Widgets on either side of content

  • Website: http://crabapplesmicrobrewpub.com/wordpress/

    I’m using WordPress theme Twenty Ten (Child theme of course)

    What I would like to do is have the primary widget on the right and the secondary widget on the left. I also would like them to float mostly outside of the content area, as they are doing now.

    The problem I am having is that I used overflow: visible – and I think that both widgets are just stacking on top of each other.

    Right now I have both widgets containing something but Secondary is appearing over top of Primary, obstructing it from view.
    Any tips on how I could make this work?

    Thank you!

Viewing 4 replies - 1 through 4 (of 4 total)
  • I think the problem lies here…

    #primary, #secondary {
        background-color: #FFFFCC;
        border: 1px solid #218C64;
        float: right;
        margin: -5px 0 10px -20px;
        overflow: visible;
        padding: 10px;
        position: absolute;
        right: 50px;
        width: 220px;}

    It seems like this is where your problem may lie. You might want to split these up so that primary and secondary have their own styles and you don’t have any conflicts. You could probable use the same css for each and set the secondary(or whichever one you want) to float left. And adjust padding and margins accordingly.

    I actually did do that originally. It didn’t give me any different results. I changed it back to what you see above just so I could pick up where I originally started. I should have clarified that, my apologies.

    Moderator Michael


    Forum Moderator

    the problem is with your css positioning;

    however, this is not a primary WordPress related problem, and it is not within the scope of this forum to teach basic formatting.

    generally, consider these fixes:


    (not cross-browser tested)

    on second thaoughts, if you want to have the widgets relative to the browser window, forget the above, and add a different/separate left: 50px; position to #secondary.

    Thank you, sorry for the trouble then.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Widgets on either side of content’ is closed to new replies.