Forums

[resolved] Different Sidebar in Firefox vs. IE (6 posts)

  1. wispsofsmoke
    Member
    Posted 3 years ago #

    My sidebar shows up in the correct position in Firefox, but for some reason shows up at the bottom of the page in IE.

    Seems like it should be simple fix, but can't figure out what to change.

    Thanks!

    http://www.naked-heart.com/blog

  2. kapiljain.in
    Member
    Posted 3 years ago #

    Just try by changing #anakha_sidebar class in css with

    #anakha_sidebar {
    float: right; /*margin: 0 0 0 415px;*/
    padding: 0;
    width: 200px;
    background: #000000;
    margin-top: 20px;
    text-align: center;
    }

    and add following blank div just after closing of sidebar for clearing float

    <div class="clear"></div>

    I think it works for you.

  3. wispsofsmoke
    Member
    Posted 3 years ago #

    Where do I put the blank div? Not sure where the "closing of sidebar" is.

    Thanks so much!

  4. kapiljain.in
    Member
    Posted 3 years ago #

    Put it just before <div id="footer">

  5. wispsofsmoke
    Member
    Posted 3 years ago #

    Tried it with no luck - any other thoughts?

  6. EMG
    Member
    Posted 3 years ago #

    Two major things wrong:

    1. You have two doctype declarations and two doctype headers. Get rid of one or condense them into one if you need the code for both. THAT in itself can be giving you a good majority of your current troubles.

    2. Your current sidebar coding won't work for what you want it to for a few different reasons.

    Your total width for your content is 608 pixels. Your narrowcolumn is 400 pixels. To make your sidebar fit next to your content, you need to make sure the total width of your sidebar is not bigger than the remainder amount of space which is, in this case, 208 pixels.

    Your sidebar code currently looks like this:

    #sidebar {
    	padding: 20px 0 10px 0;
    	margin-left: 500px;
    	width: 190px;
    	}

    Try this instead:

    #sidebar {
            padding: 20px 0px 10px 0px;
            float: right:
            width: 185px;
    }

    And see where your sidebar ends up.

    From THERE (and make sure you fix that doctype problem I mentioned earlier), you can troubleshoot the rest of your coding.

Topic Closed

This topic has been closed to new replies.

About this Topic