Question

我有一个列表，我想“排序”成两列。我这样做是通过添加两个类并左右浮动它们。

但由于某些原因，并非所有应该在右侧的元素都是向右浮动的。 See my fiddle

在此列表中，没有store个列表项，只有brand项。但仍然有一个品牌项目浮动。那是为什么？

该列表是jQuery Autocomplete的结果，因此我无法更改列表的创建方式。 I've tried：）

// HTML
<ul class="ui-autocomplete main-search">
    <li class="ui-autocomplete-category store">
        <h3>Stores</h3>
        <div class="no-match"> No matches found</div>
    </li>
    <li class="ui-autocomplete-category brand">
        <h3>Brands</h3>
    </li>
    <li class="brand ui-menu-item" role="presentation">
        <a href="#" class="ui-corner-all">BARRATS</a>
    </li>
    <li class="brand ui-menu-item" role="presentation">
        <a href="#" class="ui-corner-all" >Barrie</a>
    </li>
    <li class="brand ui-menu-item" role="presentation">
        <a href="#" id="ui-id-5" class="ui-corner-all" >Barrio Santo</a>
    </li>
</ul>

// CSS
ul { width: 500px; }
li { width: 250px; }
li.store { float: left;  }
li.brand { float: right;}

Answer 1

你必须清除花车：

li.brand { float: right;clear:right;/*Add clear:right*/}
li.store { float: left;clear:left/*Add clear left*/}

fiddle

为什么我的所有＆＃39;存储＆＃39;列表元素浮动吧？

1 个答案: