我如何左对齐div

时间:2013-10-09 13:01:19

标签: html css css-float

我想帮助左对齐我正在处理的网站上的内容。我在左侧有一个菜单,我需要一个内容div到这个菜单旁边的网站。

在我的CSS中,我目前有以下内容:

#pageContent_wrapper {
    width:100%;

}
#container {
    width:940px;
    height:100%;
    margin: 0 auto;
}

.page-content {
    float:left;
    padding: 30px 0;
}

HTML看起来像这样:

<div id="pageContent_wrapper">
    <div id="container">
       <div class="page-content">
          <p>Content goes Here</p>
       </div>
    </div>
</div>

但这不起作用。基本上我试图将div与主要内容对齐。

3 个答案:

答案 0 :(得分:1)

margin: 0 auto;移除#container 您在float: left中也不需要.page-content 整个CSS应如下所示:

#pageContent_wrapper {
    width:100%;
}
#container {
    width:940px;
    height:100%;
}

.page-content {
    padding: 30px 0;
}

答案 1 :(得分:0)

添加你的css

 text-align:left

并删除

margin: 0 auto;
等等你的重播......

答案 2 :(得分:0)

谢谢@matewka你是非常正确的将容器绝对添加到容器中并不是一个好主意我有几个人说同样的事情。所以我所做的就是将float:left添加到容器padding-left:270px,它完美无缺!因为它意味着无论我的容器中的内容是什么,它总是会与左边的菜单相隔很多像素,并且内容与浮动对齐。

我不认为我在撰写问题时确切地解释了问题所在。谢谢你的帮助。