想问下大家，我想在LI中插入一个小图标（每个LI中的图标不一样）插入后IMG后边的文字在IE6\IE7\FF下垂直位置都不正确。 有哪些方法可以解决。我现在用的是vertical-align:text-bottom；这个样式，但是FF下好像也有少许的位置偏差。

我是用背景实现的，   背景定位。

例如：

复制内容到剪贴板

代码:

.app_list li { height: 30px; background-image: url(image/appicons.gif); background-repeat: no-repeat; background-position: 2px 5px; position: relative; }
        .app_list .app-doing { background-position: 2px 5px; }
        .app_list .app-photo { background-position: 2px -35px; }
        .app_list .app-blog { background-position: 2px -75px; }
        .app_list .app-share { background-position: 2px -115px; }

但是每个LI里面都要去定一个图片背景，我觉得有点麻烦了。（我这个有20多个LI）

引用:

原帖由 patricko 于 2008-6-6 11:00 发表
但是每个LI里面都要去定一个图片背景，我觉得有点麻烦了。（我这个有20多个LI）

额，  我这有14个LI，  也是一个一个定位的

如果不喜欢这种方式，   可以给img指定一个margin-bottom值，

#linkList img{margin-bottom:-4px;padding-top:4px}

哈哈，图片挺多。 用margin-top 来试试。

margin-bottom:-4px;padding-top:4px;这样写了，无效果。

是一个图书馆的树形导航条，所以栏目也挺多的，客户还要求每个栏目图标不一样。
padding\margin\height\line-height\都没有效果，只有vertical-align有效果，但是FF下位置不对

引用:

原帖由 patricko 于 2008-6-6 11:07 发表
margin-bottom:-4px;padding-top:4px;这样写了，无效果。

加到对应的主元素的IMG上，  例如您的结构名为   <ul id="yourname">    那样式就要加成   #yourname img


再试一下，    我直接取的上线网站的源码，   都经过测试的。

感谢cuikai；问题解决了，谢谢你！

采用负margin，是个很好的解决办法。

楼主的问题其实使用背景更好解决，只需要给LI不同的class就是了。远比插图片方便

或许可以使用<i></i>,然后在写一点css就可以了~我也是网上找的~~可以兼容三种浏览器