Question

我无法弄清楚为什么我的李物品卡在div容器的右侧。我只想让李物品贴在容器的左侧。

HTML

<div id="side">
    <div class="sidemenu">
        <ul>
            <li>XC Camp</li>
            <li>Become a Sponsor</li>
            <li>Run Furman Community</li>
            </ul>
    </div>
</div>

CSS

#side {
    background-color:#333333;
    height:150px;
    float:left;
    width:20%;
    border:2px solid white;
}

.sidemenu li {
    display:block;
    border-left:4px solid #8068a0;
    padding:6px;
    margin:0px 0px 5px 0px;
    background-color:#8068a0;
}

Answer 1

它们尽可能地离开，因为每个<li>都包含在<ul>中。无序列表包含默认填充，因此您需要添加：

.sidemenu ul{
    margin:0;
    padding:0;
 }

到你的CSS。

这是关于JSfiddle的例子：http://jsfiddle.net/5aFV8/

Answer 2

默认情况下，<ul>（无序列表）包含padding，只需将其设置为0。

ul {
  padding: 0;
}

以下是您的更新代码：http://jsfiddle.net/wVHSW/

无法将列表项放在容器的左侧

2 个答案: