WordPress.org

Forums

[resolved] sidebar being pushed down (5 posts)

  1. andy3000
    Member
    Posted 2 years ago #

    I'm trying to add a sidebar to the front page at lifeinthisplace.com
    Something seems to be keeping it from floating up all the way and I can't figure out what.

  2. Andrew
    Forum moderator
    Posted 2 years ago #

    Start off with putting the sidebar HTML into the wrapper HTML element.
    The wrapper should be the parent for all elements you want within the 925px width (as defined).

  3. with sidebar problems, usually check the site's validation:

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

    errors such as 'end tag for element "div" which is not open' are pointers to some coding errors, either in the templates or in the content of the posts (or pages), or sidebar widgets, or plugins.

    possibly start again with a clean copy of your theme; then develop your idea step-by-step and check inbetween for layout and validity.

    http://codex.wordpress.org/Validating_a_Website

  4. andy3000
    Member
    Posted 2 years ago #

    Start off with putting the sidebar HTML into the wrapper HTML element.
    The wrapper should be the parent for all elements you want within the 925px width (as defined).

    Thanks did that then looked at which element is causing the problem. It is the <div id="slide_wrapper"
    When I comment it out the sidebar moves up.
    The only thing I have been able to do that leaves the slide wrapper in and moves the sidebar where it belongs is to change from position:relative to position:absolute for the slide_wrapper. When I do that the slide-wrapper covers the menu.

  5. Andrew
    Forum moderator
    Posted 2 years ago #

    Really you need to wrap your divs into 2 columns.
    You should wrap <div id="slide_wrapper"> ... </div> and <div id="big-column"> ... </div> into a div called <div class="col">.

    Then wrap the sidebar into another <div class="col">.
    Then set the CSS to float .col left

    .col {
     float: left;
    }

Topic Closed

This topic has been closed to new replies.

About this Topic