Clear? Float? How do I make this Sidebar…uh…extend past the header?

  • Author
    Posts
  • #1325338

    cyjackx
    Member

    Hello all. If you see my site, you can see clearly that I’ve managed to move the Header text centered over the text of the posts. Whether I did this appropriately according to CSS good-practice is debatable, but that’s not what I’m asking about. Is there a way for me to move the top of the sidebar to the top of the page? I tried using position:relative and just shifting it up so much, but that is not very good for all situations and it gets cutoff by the header/moving outside of its container.

    -Confused Style Sheet

    The blog I need help with is my16minutes.com.

    #1325449

    Hi there,
    This is tricky since the theme you are using does not have an overall parent container/wrapper div for all the elements in the page. Give the following a try, but make sure and look at it while logged into WordPress and also when logged out, since the sidebar is going to appear to shift up and down by the height of the top WordPress admin bar. The following seems to preserve the responsive width of the theme and everything seems to flow as it should when I narrow and widen my browser window. You may have to play with the “top” value a little to get things aligned as you desire.

    .site-main .widget-area {
    position: absolute;
    right: 0;
    top: 50px;
    }
    #1325508

    cyjackx
    Member

    Cool! I think that’ will work well. Thanks for the help. I realized that that was the problem; there’s no easy Div situation. So it just has to be moved up. Thanks, though.

    #1325520

    You are welcome. In cases like this I typically just try and hit a happy medium with positioning.

The topic ‘Clear? Float? How do I make this Sidebar…uh…extend past the header?’ is closed to new replies.