img float：左边 - 右边的边距元素

Question

正如您在本示例中所看到的http://jsfiddle.net/PCcj8/我想在我的无序列表中添加一些余量。但是，由于img float，我无法移动该列表。我怎样才能实现它？请考虑可以有不同宽度的不同图像。

Answer 1

将<ul>标记包裹在<span>代码<span>标记中，如下所示：

<span>
<ul>
    <li>test</li>
    <li>test</li>
</ul>
</span>

然后像这样设置样式：

span{
    display: inline-block;
    margin-left: 20px;    
}

Answer 2

该UL的新样式定义：

ul {     保证金：0 0 0 -5px; display：inline-block; }

它为订单项留下了一点点缩进，它会随着你放在一边的任何图像一起移动。

这是一个分叉的小提琴：enter link description here