我需要做什么才能让这些引导列左对齐？答案

【问题标题】：What do I need to do to get these bootstrap columns to align left?我需要做什么才能让这些引导列左对齐？
【发布时间】：2018-11-13 13:42:46
【问题描述】：

我有一个使用顶部和左侧导航的 Web 模板，我想让三列元素左对齐。即使在simple example 中，列也希望居中对齐。

谁能告诉我如何让列依偎在左边距？

*免责声明 - 我正在学习 Bootstrap，所以我自己回答这个问题的能力可能受到我的 Bootstrap 词汇的限制。

我尝试了多种不同的搜索方式，并将其确定为最相关的搜索查询：引导左对齐列 -nav -navbar

那个搜索产生了this 的答案，但它似乎并没有解决我的问题，或者我做得不对。

我创建了一个bootply 来模拟我的问题，所以如果有人想尝试一下，他们可以。

【问题讨论】：

你的意思不是像这样在左边吗？ bootply.com/SRnhM22tPr
还是这样？ bootply.com/FMrwn31QDc
是的！如果我正确地遵循了您的更改，您所做的只是将顶部的 div 类从容器更改为容器流体，并将最外层的列侧从 col-md-12 更改为 col-md-8。对吗？
@GeorgeLee - 不是那样的。我希望所有列并排，但我希望它们在容器中保持对齐。 ZimSystem 做对了。

【解决方案1】：

您可以将容器左对齐为described in this question，或者简单地使用全角container-fluid，然后只使用12 个Bootstrap 列中的一部分，例如8 列..

<div class="container-fluid">
    <div class="row">
        <div class="col-md-8">
         .. page layout here
        </div>
    </div>
</div>

在较小的屏幕上，您可能希望布局是全角而不是左对齐。

【讨论】：

我很清楚，container-fluid 可以解释为 container-left-aligned-with-wrapping-on-smaller-devices，是吗？
嗯..我不知道。我将其解释为仅在大屏幕上使用全宽容器的左侧部分

【解决方案2】：

在您的主 div（页面包装器）中，将类从容器更改为容器流体。

<div id="page-wrapper" class="container-fluid">

你应该看到这些元素都是左对齐的。

【讨论】：