html - 如何在下拉div中将所有无序列表 float 到左侧？

Question

我想将下拉菜单 (div) 中的所有无序列表 float 到左侧。

这是 html:

<div class="dropdown"><li><h5><a href="#">« Back</a></h5></li>
                                <ul id="0">
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                </ul>
                                <ul id="1">
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                </ul>
                                <ul id="2">
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                </ul>
                                <ul id="3">
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                        <li></li>
                                </ul>
                                <ul id="4">
                                        <li></li>
                                </ul>
                        </div>

这是CSS:

.top-bar-section .dropdown {
    position: absolute;
    left: 100%;
    top: 0;
    visibility: hidden;
    overflow-y: hidden;
    overflow-x: hidden;
    z-index: 99; }
    .top-bar-section .dropdown ul {
    float: left;
    margin: 0;
    padding: 0;
    list-style: none;
    }
    .top-bar-section .dropdown li {
      float: left;
      margin: 0;
      padding: 0;
    }

下面是当前外观和所需外观的图片:

Answer 1

我不知道你为什么在这里使用 .top-bar-section 类，因为你的标记没有任何这样的类。

所以我为您制作了简单的标记和 CSS。这可能对你有帮助

这是CSS

.dropdown ul {
 list-style: none;
 display:inline-block;
 vertical-align:top;
}
.dropdown ul li {
    display:block;
}

Js Fiddle Demo