Sidebar jumping (Sandbox)

  • Resolved katiediddesign

    (@katiediddesign)


    14 years, 9 months ago

    I’ve done quite a bit with the Sandbox and love it…but on this one site, the second sidebar is jumping, and I can’t seem to figure out how to REALLY solve it. (I can patch it so it looks solved…but that’s not what I want.)

    Here’s the site:
    https://www.bestmanweddingspeechesreview.com
    As you can see, I’ve got the sidebars over on the right and the container on the left. It’s working fine…EXCEPT when the content is shorter than the primary sidebar. When it is, the secondary sidebar jumps over to the left under the container. You can see this on the “About” Page…the search box is in the secondary sidebar.

    I could fix this momentarily by adding some margin to the bottom of the container…but that’s not a real fix. The same thing’ll only happen again if my client adds something else to the primary sidebar. Of course, I could tell him not to use the primary one…but that’s admitting that I can’t figure out how to code it so the secondary sidebar stays under the primary.

    I know WHY it’s doing it…because it’s set to float to the left. The thing is…floating it to the right doesn’t move it far enough to the right! ie: it’s right side ends up directly under the container’s right side…and I can’t seem to figure out why it doesn’t move it all the way to the right! Adding another 680px to the left margin puts it in the right location…but then, of course, it moves it off the page if the container gets longer than it again. So that’s not really a solution either.

    Anyone have any ideas on why right floating it doesn’t solve this?

Viewing 4 replies - 1 through 4 (of 4 total)
  • Thread Starter katiediddesign

    (@katiediddesign)

    Anyone?

    Anyone have any ideas on why right floating it doesn’t solve this?

    nope;

    when i add ‘float:right;’ to #secondary, like so:

    div#secondary {
margin:0 0 0 5px; float:right;
}

    it actually moves all the way to the right edge of the sidebar – a few pixel further right than before – so you would need to add a right margin to the code above.

    (tested in firefox with web developer add-on)

    float:right;
clear:right;

    Try it. should work. =)

    Thread Starter katiediddesign

    (@katiediddesign)

    I figured it out with the outline feature of web developer. Don’t know why I didn’t think of that before. It was catching just barely on the bottom of the primary sidebar.
    Soo… I added:
    clear:right; to make it clear the primary sidebar, and then floated both right, and then adjusted my margins and it works.

Viewing 4 replies - 1 through 4 (of 4 total)
  • The topic ‘Sidebar jumping (Sandbox)’ is closed to new replies.