Bootstrap: 如何将宽度为 100% 的元素放置在固定高度的卡片底部?

Bootstrap: How to position an element with 100% width on the bottom of a card with fixed height?

我有一张固定高度的简单卡片。现在我想在卡片底部放置一个工具栏。工具栏需要有卡体的全宽。但它不起作用:

<div class="card" style="height: 300px;">
  <div class="card-body">
    <div style="border: 1px solid red; width: 100%; position: absolute; bottom: 0px;">
      toolbar
    </div>
  </div>
</div>

它接缝了,我的工具栏的 100% 宽度引用了卡片,而不是卡片主体。如何解决这个问题?

使用这个我希望这个工作

     <div class="card-footer text-muted"> toolbar </div>