要让每个li向左浮动的话应当让其block化 CSS文件修改如下
#wrap {
margin:auto
width:800px
padding-left:0px
}
#menu ul {
display:block
font-size: 14px
list-style: none
padding:0px
}
#menu {
background: url(menu-d.png) repeat-x top left
height: 36px
overflow: visible
padding-left: 0px
margin:0px
}
#menu li {
float: left
position: relative
z-index: 5
}
楼主您好，我调试过，你也试试。你懂CSS，我还是按照步骤一步一步来。以便不懂CSS也可以学习下。
第一步，进入店铺装修点编辑：
第二步，点显示设置：
第三步，将显示代码放进去，这个是我们团队的代码：
第四，依您的背景颜色和文本变粗，代码如下：
.all-cats .link{background:none repeat scroll 0 0 #FF0000}.skin-box-bd .all-cats .title{font-size:12pxfont-weight:boldcolor:#000000}
特别说明一下：.all-cats .link{background:none repeat scroll 0 0 #FF0000}.这段代码是控制“所有分类”的背景，我设置的是红色，颜色代码为#FF0000；
skin-box-bd .all-cats .title{font-size:12pxfont-weight:boldcolor:#000000}这段代码是控制字体顺序依次是“所有分类”文字的大小，是否加粗，文字的颜色。
您试试。
第五，拓展一下所有分类类目下的子类目如何实现控制。
您可以在这里再进一步深入研究一下。
最后，给个建议，就是利用谷歌浏览器，鼠标点右键，有一项是“审查元素”，可以查看代码，慢慢调试。
用 a:hover span 试试，如果你 css 非常熟，能处理好很多细节问题，有可能能行，不断的嵌套 a:hover span ，下面这个如果你看得明白的话可以试试：
<ul>
<li>
<a>
家用电器
<span>
<strong>生活电器</strong>
<ul>
<li><a>净化器</a></li>
<li><a>净水设备</a></li>
<li><a>电风扇</a></li>
</sapn>
</a>
</li>
</ul>
核心就是一个链接里面放一个span，然后这个span里面又放二级菜单的链接：
<a>一级菜单<span><ul>二级菜单</ul></sapn></a>
然后先把 span 用 display:none隐藏起来，当一级菜单的链接发生 a:hover 时，又把 span 的 display 设置为 block 使其可见。
纯 css 不上 js 并且：不用表格、条件注释的话，那上面我说的这些就是唯一的办法了。
另一种可能是：上面我说的这些根本做不到你想要的效果，因为我也没试过这么复杂的嵌套会出现什么预料之外的东西要处理，考虑各浏览器兼容问题，能否处理掉这些问题是未知的。
你至少需要解决：
IE6 下 a:hover span 无效(要让其生效需要设置一个多余的空背景，方法自行百度)
各种 z-index 问题
span 的复杂定位
其他莫名其妙的问题
...
最终结果一切未知，有兴趣的话可以自己试着写代码。
