css - ul-li 元素样式不正确

Question

您好，我正在尝试构建一个列表(代码共享于:http://jsfiddle.net/jLM4J/)。

我的问题是，虽然列表元素不应该重叠，但为什么我的列表与第一项重叠，我试图在其中显示用户详细信息。

即使我用 ul(http://jsfiddle.net/yYEhS/1/) 外部/内部的单独 div 替换用户 li 元素，ul 列表仍然与我的元素重叠，但它不应该重叠，因为我的元素是显示为 block 的 div。

任何人都可以帮忙，因为这让我很困惑。

Answer 1

这是因为用户 div 声明中的 float:left;。像这样删除它，它起作用了:

.user-image {
    width: 30px;
    height: 30px;
    background: url('../../images/user.png') no-repeat center center;
    margin: 1px;
    border: 1px @border-style @border-color;
}

如果没有可供查看的设计，就很难知道为什么您可能会有那个 float :留在那儿。

如果你需要它与 PAGE 左对齐，它需要在 ul 之外。
如果您希望它在页面中左对齐，请将 text-align:left; 分配给 li 元素。