CSS文本不在中心对齐div下左浮动答案

【问题标题】：CSS text not float left under center align divCSS文本不在中心对齐div下左浮动
【发布时间】：2015-05-27 08:47:06
【问题描述】：

我希望我的“body2”div 位于页面中心，段落向左浮动。但是我的代码在两次潜水中都应用了中心对齐属性。我在 CSS 中使用 float left 作为 para 但没有解决方案。

<div class="row body2" align="center">

        <div class="writing">
            <div class="date">13.01.15</div><br>
            <div class="heading">My biggest audio project ever.</div>

            <div class="container-fluid">
            <div class="para">The complete setup took about 6 hours. We were extremely contended with the result taken into the account of everything is new. A late 
            </div><br><br>

            </div>
            </div>
    </div>

CSS：我正在使用 text-align:left 使我的段落左对齐，但它显示居中对齐。

.body2
{
    background-color: black;
    margin-top: -10px;
    margin-left: auto;
    margin-right: auto;
}
.writing
{
    margin-top:64px ;
    margin-left: 88px;
    padding-bottom: 50px;
}
.date
{
    color: #716558;
    font-family: myrid Pro;
    font-size: 20px;
}
.heading
{
    font-family: georgia;
    font-size: 36px;
}
.para
{
    margin-top: 40px;
    line-height: 170%;
    text-align:left;
}

【问题讨论】：

请包含你的css
请将您的代码发布到codepen.io 或jsfiddle.net，以便我们查看您的代码并帮助您修复它。
只是一点建议。对段落使用<p> 标签。
感谢@jojo 我会关注
如果您使用 align="center" 这将使您的 div 居中并同时将您的文本居中，以覆盖它，将文本设置为您的样式 .body2{text-align:left}检查here

标签： html css

【解决方案1】：

完整的设置大约需要 6 个小时。考虑到一切都是新的，我们对结果非常抗争。迟到的

【讨论】：

【解决方案2】：

在这种情况下，align 属性充当text-align。相反，您可以给 .body2 一个非自动宽度并应用 margin: auto; 使环绕居中：JS Fiddle

.body2 {width: 70%; margin: auto;}//can also apply max-width

【讨论】：

添加宽度使页面静态。没有反应。
你可以给它一个百分比——这只是一个例子。答案和小提琴已更新。

【解决方案3】：

您可以通过设置 div 边距自动 .body2{margin:0 auto;text-align:left} 并从 <div class="row body2" align="center"> 中删除 align="center" 导致您的文本居中，或者设置 div body2 position absolute .body2{position:absolute; width: 300px; left: 50%; margin-left:-150px} ，该样式将使您的 div 在页面中心，希望对您有所帮助

【讨论】：

【解决方案4】：

如果你想将 div 对齐到页面的中间，

.body2{ width: 500px; margin: 0 auto;}

这将使您的 div 与页面的中心对齐，根据您的要求更改宽度。

文本左对齐

.para{text-align:left;}

用户这条线，它应该工作好运

【讨论】：

添加宽度使页面静态。没有反应。
@FarrukhJaved 您可以将宽度添加为百分比，width:90%; 类似的东西