IE6 weirdness -- first list item indented too far

Answer 1

Hi Chris

Looks like some nastiness in your CSS. If I've got this right, and I hope that I have, you are looking to have the committee members list just to the right of the title 'Committee members'

With IE6 I tend to avoid using margins where possible as there are some fun and interesting bugs there for the unwary developer.

The following may help you out, but I can't honestly say what it will do to the rest of your page.

.organizer-label {
    float: left;
    width: 145px;
}

.organizer-value {
    padding-left: 5px;
    float: left;
}

.organizer-value ul {
    margin-left: 1em;
    margin-top: 0;
    padding-left: 0;
    padding-top: 0;
    line-height: 1.1em;
}

Hope that this helps

R.

Answer 2

Hi,Chris :)

try it ".organizer-value { overflow:hidden;float:left;}"

Hope that this helps

Answer 3

You need to apply hasLayout to the div .organizer-value

.organizer-value {
    margin-left: 150px;
    zoom:1;
}

Answer 4

It's a float bug. You can step around it by nesting the ul inside a wrapper div like so;

<div class="organizer-subsection">
  <div class="organizer-label">Committee members:</div>
  <div class="organizer-value">
    <div>
       <ul>
          <li>Vangala Subrahmanyam, Sai Advantium Pharma Ltd, Pune, India</li>
          <li>Ramaswamy Iyer, Bristol-Myers Squibb, Lawrenceville, USA</li>
          <li>Ragu Ramanathan, Bristol-Myers Squibb</li>
        </ul>
     </div>
   </div>
</div>

and changing the .organizer-value definition to this;

.organizer-value {
    float:left;
}

Floats are evil in IE (as is anything remotely useful that CSS does). The plus side of such common bugs is that they are fairly well documented. PositionIsEverything is a useful website for helping troubleshoot IE display bugs.

Answer 5

From another question here on SO, people reference the IE7-js library. It's supposed to make IE6 behave like a standards compliant browser.This might also fix your spacing problem