【问题标题】：div align on the left of centered divdiv 在居中 div 的左侧对齐
【发布时间】：2015-02-22 03:16:10
【问题描述】：

我需要做下一件事：

我需要将 div 放在页面中间

.container12
    {
    max-width: 960px;
    width: 100%;
    height: auto;
    overflow: hidden;

    margin-left: auto;
    margin-right: auto;
    }

我需要另一个类名为“leftDiv”的 div，它将位于类“container12”的 div 的左侧。 .leftDiv 应该浮动在 .container12 的左侧，并且宽度从页面末端到 .container12 的左侧。

图片如下：

leftDiv 的类怎么写？

【问题讨论】：

您应该发布您尝试过的内容——例如您的leftDiv，以及您使用过的任何其他css 类。还有一个 HTML 示例。最好在小提琴或片段中。您之所以被否决，是因为就目前而言，这实际上是要求某人为您完成工作，而不是要求社区帮助解决特定问题。
非常感谢您的回答。我完全同意你的看法。我将在我的问题中添加一些代码。

标签： html css

【解决方案1】：

根据您的问题，您可以使用以下简单方法：

.container12 {
  width:50%;
  height:200px;
  border:1px solid black;
  display:inline-block;
}
.leftDiv {
  width:25%;
  height:200px;
  border:1px solid black;
  display:inline-block;
  float:left;
}

请记住，浮动会将元素拉出页面流，因此您需要将clearfix 应用到居中的div 以保持元素正确对齐。

CodePen demo

【讨论】：

【解决方案2】：

将 float:left 添加到每个元素，它们应该并排排列。像这样的 -

.container12
        {
        max-width: 960px;
        width: 100%;
        height: auto;
        overflow: hidden;
        float:left;

        margin-left: auto;
        margin-right: auto;
        }

    .leftDiv {
        width: 40%; 
        height: auto;
        overflow: hidden;
        float:left;

    }

确保使用宽度等，你应该得到你需要的。

【讨论】：