I hate IE….sidebar misaligned…help please!

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

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

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.

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

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="https://www.theparadigmexchange.com/wp-content/themes/mimbo2.2/images/tpesearch.jpg"></H3><?php include (TEMPLATEPATH . '/searchform.php'); ?></li>
</div>

Thanks again…
H.

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.

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

A good tutorial on all things CSS is HERE

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.

In the example you showed above, put a

<ul>
<li> ....blah blah..
</li>
</ul>

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.

So anyone….does it match now?

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>