标签: bootstrap-4

图像位于 h1 编辑边距中，h1 仅编辑边距左增加图像左侧的边距。尝试增加 i 元素的边距也没有任何作用，在 i 元素上也没有任何作用。

  <h1 class="display-4"><i class="fas fa-camera-retro"></i>The Image Gallery</h1>
           <p> A bunch of beautiful images that I didn't take</p>

我想增加相机图标和文本之间的间距。

我试图将一个绝对按钮放在一个 div（在底部）中，但它似乎不起作用..这是我现在正在做的事情：

.mc-item {
  background: #F0F0F0;
  border: 1px solid #DDD;
  height: 140px;
  padding: 20px;
}

.mc-item a {
  position: absolute;
  bottom: -19px;
  left: 50%;
}

.mc-item p {
  text-align: center;
}

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0/css/bootstrap.min.css" integrity="sha384-Gn5384xqQ1aoWXA+058RXPxPg6fy4IWvTNh0E263XmFcJlSAwiGgFAW/dAiS6JXm" crossorigin="anonymous">
<div class="col-md-4 col-sm-12">
  <div class="mc-item">
    <p>Changez votre adresse email ou votre mot de passe.</p>
    <a asp-controller="MyAccount" asp-action="Settings" class="btn btn-primary">Paramètres</a>
  </div>
</div>

这给出了以下结果：

我想要的是中间居中的按钮。是否left: 50%考虑整体.col div？我尝试将buttona包裹起来，div并且div的宽度变为 380，这与.col div(div与<p>) 相同。

我目前正在使用Bootstrap 4框架构建网站。我注意到我无法正确对齐项目。

例：

Bootstrap 4官方文档行定位

我的行定位

根据文档代码：

    <div class="container">
  <div class="row align-items-start">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
  </div>
  <div class="row align-items-center">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
  </div>
  <div class="row align-items-end">
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of three columns
    </div>
    <div class="col">
      One of …

我正在升级到Bootstrap 4，并且遇到了一些问题。

我有一个导航栏，看起来像这样：

如您所见，正确的navbar-collapse元素占用的空间超过了所需的空间：

如何设置元素仅使用所需的宽度，而无需进一步扩展？

这是小提琴：https : //jsfiddle.net/Zoker/ndv0ec54/

对于我使用的 symfony 形式和树枝

{{ form_errors(form) }}

使用bootstrap_4_horizontal_layout.html.twig，它工作正常，输出如下：

<span class="alert alert-danger d-block"><span class="d-block">
                    <span class="form-error-icon badge badge-danger text-uppercase">Error</span> <span class="form-error-message">Error</span>
                </span></span> 

但我需要对其进行自定义以翻译消息旁边的引导错误标签。我可以在哪里定制它？

我需要在不使用 Angular Material 或 bootstrap 的情况下以角度制作日期选择器，如下图所示：

我怎样才能使它成为可能？

ps- 业务需求。

我在 bootstrap 4 中遇到崩溃问题。

我尝试通过 Javascript 来控制它，但它不起作用：

有人可以帮我吗？

Codepen https://codepen.io/Ages/pen/dempQm

我已经用bootstrap scrollspy组件转换了基本的html页面，但是我的导航不起作用（页面滚动时没有变化）。

我使用以下命令安装了bootstrap 4：

npm install bootstrap

页面滚动没有变化，或者当我单击菜单时没有“活动”标志。

你能帮助我吗 ？谢谢 ：）

我想row-fluid通过使用react-bootstrap来获得bootstrap类的结果，但是没有在库中获得标准方法。诸如Grid组件的流体道具之类的东西，但组件不支持Row。

我尝试浏览https://react-bootstrap.github.io/layout/上的文档，但没有得到任何重要帮助。