html中更改列表高度,格式化列表的水平列表，如何修复动态html的高度

我正在创建一个Site Map类型的菜单，以便坐在页面的底部，快速访问网站结构的前两个级别。不过，我在格式化列表时遇到问题，因此它们在包装时整齐地显示。格式化列表的水平列表，如何修复动态html的高度

这里是我想要去一个画面：

不过，我结束了这个样子的：

这里的简化，以显示问题的代码，通过脚本列表中的来自站点地图XML文件JSFiddle

#footer-menu {

float:left;

background:#454545;

color:#FFFFFF;

width:850px;

margin:50px auto 0 auto;

padding:10px 10px 2px 10px;

display:inline;

}

#footer-menu ul {

padding:0;

list-style-type:none;

left:auto;

overflow: auto;

}

#footer-menu li {

margin:0 20px 5px 0;

padding-left:6px;

list-style-type:none;

float:left;

display:inline;

background:none;

position:relative;

font-family:Arial;

font-weight:bold;

border-left:1px solid #FFFFFF;

}

#footer-menu ul li ul {

margin:5px 0 5px 0;

}

#footer-menu ul ul li {

float:none;

padding:0;

margin:0 0 2px 0;

font-weight:normal;

display:block;

width:auto;

border:0;

}

#footer-menu a {

text-decoration: none;

color: white;

}

#footer-menu a:hover {

text-decoration: underline;

color: white;

}

• List 1 Title is quite looooong
  • List 1 Item 1
  • List 1 Item 2
  • List 1 Item 3
  • List 1 Item 4
  • List 1 Item 5
  • List 1 Item 6
  • List 1 Item 7
  • List 1 Item 8
• List 2 Short title
  • List 2 Item 1
  • List 2 Item 2
  • List 2 Item 3
  • List 2 Item 4
• List 3 Title of average length
  • List 3 Item 1
  • List 3 Item 2
  • List 3 Item 3
• List 4 with no sub items
• List 5 Should wrap under list 1
  • List 2 Item 1
  • List 2 Item 2
  • List 2 Item 3
  • List 2 Item 4

的项目的链接，生成HTML，该列表将改变为PA ges被添加到网站，所以我正在寻找一个解决方案，它不需要我手动调整列表的高度，以便正确格式化。

是否有可能使用CSS来修复整行列表的高度，以便任何包裹列表从新行的左侧开始？

2012-04-24

Tony