我正在尝试使用 bootstrap 4 卡片页脚系统，需要在页脚中并排放置 2 个按钮，但我想让它们填满可用空间。

例如： see here for current bootstrap footer button

此按钮使用所有可用空间作为其背景。我想修改它以在左侧有一部分绿色检查，然后在右侧有一个红色按钮。我再次希望它们像图片中一样填充页脚中的可用空间，但它们在同一个页脚中，并且在页脚中的宽度相同。我不只是想要页脚中的浮动按钮。

这是我生成单个完整页脚按钮的代码：

<a class="card-footer" style="background-color:#85e085">
    Check In
</a>

这是我必须制作不产生预期输出的 2 按钮页脚的代码：

<div class="row">
    <a class="col-sm-6" style="background-color:#85e085">
        Check In
    </a>
    <a class="col-sm-6" style="background-color:#85e777">
        Check In
    </a>
</div>

我试过为页脚制作一个 div 并在行中添加带有列类的按钮，我试过弄乱弹性框，但似乎没有给我预期的结果。任何指导将不胜感激！

编辑： 这是我在考虑接受的答案后使用的最终代码：

<div class="container card-footer" style="padding:0!important;">
    <div class="row" style="margin:0!important;" >
        <a class="col-6" style="background-color:#85e085;text-align:center;padding:1em 0em">
            Check In
        </a>
        <a class="col-6" style="background-color:#85e777;text-align:center;padding:1em 0em;">
            Check In
        </a>
    </div>
</div>