Firefox bug: Figures break grid

Created by: alienlebarge

Description

When using Figures in a grid, it doesn't fit the width of the container.

Here's a Pen to reproduce the bug

Environment

• Browser version: All firefox version (.zip of screenshots)
• Bootstrap version: 4.0.0-alpha.6

Cause

The problem is caused by the following code:

.figure {
  // Ensures the caption's text aligns with the image.
  display: inline-block;
}

Additional Info

  <div class="row">
    
    <article class="col-md-6">
      <figure class="figure">
        <img src="..." class="figure-img img-fluid rounded" alt="...">
        <figcaption class="figure-caption">...</figcaption>
      </figure>
      <p>...</p>
    </article><!-- /.col-md-6 -->
    
    <article class="col-md-6">
      <figure class="figure">
        <img src="..." class="figure-img img-fluid rounded" alt="...">
        <figcaption class="figure-caption">...</figcaption>
      </figure>
      <p>...</p>
    </article><!-- /.col-md-6 -->

  </div><!-- /.row -->