对齐底部的两个按钮

Question

我正在使用Bootstrap 4＆＃39; card groups。我想将两个按钮对齐在应该位于.card底部的同一行。

jsfiddle。

我试过

.card {
  position: relative;
}

.btn {
  position: relative;    // <- if I use absolute here, it will be ugly
  bottom: 0;
}

以及

.card {
  display: table;
}

.btn {
  display: table-cell;
  vertical-align: bottom;
}

但两者都不起作用。

Answer 1

这样的东西对你有用吗？

https://jsfiddle.net/44Lnjj8d/5/

.card {
  position: relative;
  padding-bottom: 40px;
}

.btn {
  position: absolute;
  bottom: 10px;
  left: 50%;
  -ms-transform:: translateX(-50%);
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
}