您如何左对齐div？

Question

我试图通过使用以下方法使div左对齐：

<div class="col-md-3 float-left">

和

<div class="col-md-3" style="text-align: left;">

我尝试的没有工作吗？

我现在尝试了float，！important仍然无法正常工作，所以这里有更多代码：

<div class="form-horizontal">
        <h4>Branch</h4>
        <hr />
        @Html.ValidationSummary(true, "", new { @class = "text-danger" })
        <div class="form-group col-md-12">
            <div class="col-md-2">
                @Html.LabelFor(model => model.BranchName, htmlAttributes: new { @class = "control-label" })
            </div>
            <div class="col-md-3">
                @Html.EditorFor(model => model.BranchName, new { htmlAttributes = new { @class = "form-control" } })
                @Html.ValidationMessageFor(model => model.BranchName, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group col-md-12">
            <div class="col-md-2">
                @Html.LabelFor(model => model.Active, htmlAttributes: new { @class = "control-label" })
            </div>
            <div class="col-md-3" style="float: left !important;">
                @Html.EditorFor(model => model.Active)
                @Html.ValidationMessageFor(model => model.Active, "", new { @class = "text-danger" })
            </div>
        </div>

        <div class="form-group">
            <div class=" col-md-offset-1 col-md-2">
                <input type="submit" value="Create" class="btn btn-default" />
            </div>
        </div>
    </div>

这是一张图片，了解我的意思。 复选框和文本框距离它们的标签还很远，看起来很糟糕。

Answer 1

没有更多的代码或对该问题的更具体的描述，您将无法告诉您太多信息。 无论如何，我的假设是您是否需要使div的内容保持对齐？ 根据您使用的类名，我假设您正在使用Bootstrap。 在这种情况下，请尝试将此类添加到div中：

text-left

如果这不起作用，请尝试以下操作：

style="text-align: left !important;"

如果第二个有效，则说明您在其他地方编写了CSS，请尝试查找此CSS并将其删除/更改。 如果对此感到困惑，请阅读CSS特异性 。 不要无缘无故地附加!important 。 通常，这被认为是不良做法。

参考： http : //getbootstrap.com/css/#type-alignment

Answer 2

您想分配一个div，而不是文本。 因此，您可以使用：

<div class="col-md-3" style="float:left">

Answer 3

对于div的左对齐

<div style="float: left;"></div>

用于文本的左对齐

<p style="text-align:left;"></p>

Answer 4

尝试

<div class="col-md-1">

代替

<div class="col-md-2">

在标签Div上的间距应来自col-md-2的大小。 如果选择col-md-1，则间隙应较小。