[resolved] Position Issue (9 posts)

  1. corefx
    Posted 9 years ago #

    I took the default theme and just beat it to hell. Anyhow I'm having an issue.


    On the bottom left hand side, the layout doesn't go under the navigation. I'm not quite sure why. Any ideas?

  2. Doodlebee
    Posted 9 years ago #

    your "navi" is set to "position:absolute;"

    Absolute positioning takes items out of the document flow. Nothing is related to it, so the outer container won't push past it.

    You can *try* setting your #container as "position:relative;" but it may not solve your problem.

  3. corefx
    Posted 9 years ago #

    you are correct, it didn't solve it.

  4. Doodlebee
    Posted 9 years ago #

    Then you need to remove the "position:absolute;" from your "navi" section. But in looking at how things are set up, this is going to cause your sidebar to move somewhere else.

    Change this section:

    #info, #update, #news, #request {
    width: 459px;
    margin-left: 201px;...

    remove the "margin-left" and put in "float:right;", and remove the absolute positioning from #navi, and put in "float:left;"

    Then you'll have to clear your floats. So you'll need to add in:

    #news:after, #navi:after {

    That probably won't completely fix it, but it'll give you something to start with.

  5. Doodlebee
    Posted 9 years ago #

    by the way, you have "Winamp" spelled wrong. :)

  6. corefx
    Posted 9 years ago #

    that too didn't work, took the background (#container) away and threw the sidebar (left side) down about 30 pixels. I appreciate the help alot though.

  7. Doodlebee
    Posted 9 years ago #

    Actually, yeah, it worked, but yes, it does push the stuff down a bit below the header. What I gave you was a *start* not a complete solution.

    Depending on what browser you're viewing in is why the "container was taken away" - it's not "taken away" it just that whatever browser you are using doesn't clear floats in this manner. So you can go into your template files and add in <hr class="clear" /> right *before* the closing div tag (the one that closes your #container div), and in your CSS, add in

    hr.clear {

    That will cause the #container to now clear both floats. You'll have to find out what setting you have in your header (or whatever is above these fields) that is causing them to push down by such a margin.

    But yes, what I gave you *is* correct - it was just a starting point. The rest is "fiddling" until you get what you want.

  8. corefx
    Posted 9 years ago #

    i cant help but say you are the man.. this has been a reoccuring problem for me. Thanks tons

  9. Doodlebee
    Posted 9 years ago #

    LOL - actually, I'm the "woman" if you don't mind - but glad it worked out for you :)

Topic Closed

This topic has been closed to new replies.

About this Topic


No tags yet.