CSS的显示有问题:内联块和IE7!

我创建这个只是为了解释我的问题。它是一些列表项显示为内联块。我原来的方法也不管用,所以我用了这个 CSS .

http://jsbin.com/upexu/edit

这在FF和IE7中非常有效,作为一个独立的。

不幸的是,在我的站点上的实现中,它在IE7中没有正确显示(它们看起来是一个叠在另一个之上)。

火狐

firefox http://www.alexanderdickson.com/hosted/stackoverflow.com/display-inline-ff.png

IE7

ie7 http://www.alexanderdickson.com/hosted/stackoverflow.com/display-inline-ie7.png

现在,有人能告诉我为什么他们在我的例子中不起作用(请看上面的图片并查看站点,它在最右边(不能错过)。

如果我给列表项一个明确的宽度,它在IE7中似乎是有效的——但是这看起来很危险,而且我不想做额外的维护。我可能会的 li#nsw { width: 3.5em } 但是很难看我 不应该 不得不。

我确实使用 Eric Meyer's CSS Reset Reloaded .

如果你知道解决方案,请告诉我!

谢谢。

更新

这是复选框的HTML

<ul class="checkboxes">
    <li><input type="radio" id="free-case-review-nsw" value="nsw" name="state" /><label for="free-case-review-nsw"><acronym title="New South Wales">NSW</acronym></label></li>

    <li><input type="radio" checked="checked" id="free-case-review-qld" value="qld" name="state" /><label for="free-case-review-qld"><acronym title="Queensland">QLD</acronym></label></li>

    <li><input type="radio" id="free-case-review-nt" value="nt" name="state" /><label for="free-case-review-nt"><acronym title="Northern Territory">NT</acronym></label></li>

    <li><input type="radio" id="free-case-review-other" value="other" name="state" /><label for="free-case-review-other">Other</label></li>
  </ul>

这是CSS

 #free-case-review-form .checkboxes {
        border: 1px solid #000;
        padding: 5px 0;
        margin-bottom: 8px;
        overflow: hidden;
    }

    #free-case-review-form .checkboxes li {
        display: inline-block;
        display: -moz-inline-box;
        *display: inline; /* for ie */
        zoom: 1;
        overflow: hidden;
    }

    #free-case-review-form .checkboxes li input {
        display: inline;
        width: auto;
        border: none;
        margin-bottom: 0;
        padding: 0;
        float: left;
    }

    #free-case-review-form .checkboxes li label {
        display: inline; /* just an attempt - they should be block level anyway */
        float: right;
    }

尽管我确实建议查看上面的站点,因为继承了更多的CSS,特别是通过使用样式重置。