Bootstrap: Как разместить элемент со 100% шириной в нижней части карты с фиксированной высотой?

Question

У меня есть простая карта с фиксированной высотой.Теперь я хочу расположить панель инструментов внизу карты.Панель инструментов должна иметь полную ширину тела карты.Но это не работает:

<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% ширина моей панели инструментов ссылается на карту, а не на тело карты.Как решить эту проблему?

Answer 1

Используйте это, я надеюсь, что эта работа

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