div内的css对齐列表

时间:2012-06-18 21:13:20

标签: css layout text

我在CSS上对齐图像时遇到了很多问题。 这是事情,我在这个div里面有一个名为“toggle”的div我有一个列表ul-li每个li我有文本然后3个图像,但我想让图像对齐一些图像的对齐方式相对于文本而不是左边的填充。

http://aluna.webdcg.com/visistat/

1 个答案:

答案 0 :(得分:0)

也许这就是你所需要的。请参阅以下代码:http://jsfiddle.net/67VWe/

CSS:

* { font-family: Tahoma; }
ul { width: 200px; margin: 20px; border: 1px solid #777; }
li { padding: 2px; border-bottom: 1px dotted #777; }
li label { width: 120px; float: left; }
​

HTML:

<div id="toggle">
    <ul>
        <li><label>Text 1</label> <img src="http://admin.visistat.com/sales/img/icon-pulse-dot-red.png" width="22" height="22" /></li>
        <li><label>Text 1234</label> <img src="http://admin.visistat.com/sales/img/icon-pulse-dot-red.png" width="22" height="22" /></li>
        <li><label>Text 1234567</label> <img src="http://admin.visistat.com/sales/img/icon-pulse-dot-red.png" width="22" height="22" /></li>
    </ul>
</div>

-

标签标记,宽度浮动值就可以了。