WordPress.org

Forums

I hate IE....sidebar misaligned...help please! (13 posts)

  1. iamharlan
    Member
    Posted 6 years ago #

    Ok, I'm usually reluctant to post on the forums here, because most newbies get thoroughly shredded...but I have nowhere else to go. <tear>

    http://www.theparadigmexchange.com

    Anywho...I'm having trouble with part of my site not looking right in IE. The sidebar looks great in Firefox and on my iphone...but gets all misaligned and jacked in IE. I really don't even have access to a computer with IE on it most of the time, so I usually hear days later that it still looks messed up.

    I've tried adding the "." before css codes (I read somewhere that this would work) to see if that would help, but to no avail.

    I just don't understand because it looks great in Firefox and Safari on my Mac, but looks totally jacked on PCs in IE. But I know that there are still a significant number of people using IE, so I need to get it sorted.

    Any help would be greatly appreciated. Thanks.

  2. iamharlan
    Member
    Posted 6 years ago #

    Oh yeah, I'm using wordpress 2.7 if that matters.

  3. zeniph
    Member
    Posted 6 years ago #

    yeah yeah IE sucks and all that - however the problem relates to your coding not some weird IE bug - its just luck that non IE browsers render it how you wanted.

    1. You have at least 2 instances of the ID "sidebardivs" - you can only have 1 instance of an ID on a page. Change the IDs to a class - ".sidebardivs" in the CSS and change the HTML to class="sidebardivs"
    2. The 2 DIVs currently with ID of "sidebardivs" are not enclosed within LI tags - they must be if they're inside a UL
  4. iamharlan
    Member
    Posted 6 years ago #

    Ok...

    That sounds good. I did #1 and it still looks good in my browser. For #2 though, I'm not sure I'm seeing what you are seeing. The first sidebar item, (not "sidebardivs") is a widget that is having issues of its own. The second is a search form, which is not a list at all, nor is it enclosed in a UL. Then the third is enclosed in LI and UL.

    Am I missing something?

    Yeah, and I still can't check this in IE from my house, so if you don't mind taking a minute to see if they render the same, that would be oh so bueno.

    Thanks for your help.

    H.

  5. zeniph
    Member
    Posted 6 years ago #

    your first twitter sidebar item may indeed be at the heart of the problem

    change this

    ...<div class="twittertext" style="overflow:auto; height:165px; width:250px"><li>
    <ul class="twittercopy" id="twitter_update_list">...

    to:

    ...<div class="twittertext" style="overflow:auto; height:165px; width:250px">
    <ul class="twittercopy" id="twitter_update_list"><li>...

    regarding the DIVs:

    The second is a search form, which is not a list at all, nor is it enclosed in a UL. Then the third is enclosed in LI and UL.

    they are inside <ul id="sidelist"> but they are not inside LI tags - they should be

  6. iamharlan
    Member
    Posted 6 years ago #

    Ok....I changed the first part. Hopefully that helps.

    Now on the DIVs...

    Should I place the LI tag before the UL id="sidelist" tag and after the final UL tag, or somewhere in the specific DIV like this?

    <div class="sidebardivs"><H3>
    <li><img src="http://www.theparadigmexchange.com/wp-content/themes/mimbo2.2/images/tpesearch.jpg"></H3><?php include (TEMPLATEPATH . '/searchform.php'); ?></li>
    </div>

    Thanks again...
    H.

  7. iamharlan
    Member
    Posted 6 years ago #

    I hate to bump...but...

    I have made the change as I described above. But I have no way of checking my work over the next few days.

    Does it look pretty much the same from Firefox to IE?

    Thanks again...

    H.

  8. Saurus
    Member
    Posted 6 years ago #

    You have an Unordered List. The UL element goes before the individual LIst elements.

    A good tutorial on all things CSS is HERE

  9. iamharlan
    Member
    Posted 6 years ago #

    Ok...I think I may have taken care of that though. Zeniph helped me a bit, and I wanted to see if I corrected the problem.

  10. Saurus
    Member
    Posted 6 years ago #

    In the example you showed above, put a

    <ul>
    <li> ....blah blah..
    </li>
    </ul>
  11. iamharlan
    Member
    Posted 6 years ago #

    It is already in the "UL sidelist" from the beginning of the sidebar.... does it need an additional one? I don't want it to get messed up by there being to many.

  12. iamharlan
    Member
    Posted 6 years ago #

    So anyone....does it match now?

  13. zeniph
    Member
    Posted 6 years ago #

    no still no good - please just check you sidebar code thoroughly.

    you have some stray closing </div>s messing things up and you still have <div> tags imeadiately inside your UL. The only things that can go imeadiately after UL is an LI tag. Inside LI you can place (nearly) whatever you want.

    further to what Saurus said, your basic structure should be:

    <div id="sidebar">
      <ul id="sidelist">
      <li> <div class="sidebardivs"><H3>heading</H3>images, forms, more UL, LI whatever </div> </li>
      <li> blah </li>
      <li> blah </li>
      </ul>
    </div>

Topic Closed

This topic has been closed to new replies.

About this Topic