如何通过底部卡boostrap 4垂直对齐。通过bootstarp 4底部对齐。我正在尝试将Bootstrap 4（4.0.0-alpha.6）中心的超大屏幕内容垂直对齐。在Mac桌面上的Chrome和Safari上，这种情况发生得很好，但在我的iOS设备上，文本仍与顶部对齐，这两种情况都没有。
.container-fluid > .row {
overflow-x: auto;
}<html><head><link href="https://use.fontawesome.com/releases/v5.0.10/css/all.css" rel="stylesheet">
<link href="/css/fullcalendar.min.css" rel="stylesheet">
<link href="/css/fullcalendar.print.min.css" rel="stylesheet" media="print">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/css/bootstrap.min.css">
<script src="/js/lib/moment.min.js"></script>
<script src="/js/lib/jquery.min.js"></script>
<script src="/js/fullcalendar.min.js"></script>
<script src="/js/gcal.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.0/js/bootstrap.min.js"></script>
</head>
<body>
<div class="container-fluid">
<h2>Bootstrap Horizontal Scrolling with Flexbox</h2>
<div class="row flex-row flex-nowrap">
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title 123 42332 4324 2342 423 234 23</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
<div class="col-3">
<div class="card card-block">
<img class="card-img-top" src="..." alt="Card image cap" height="200">
<div class="card-body">
<h5 class="card-title">Card title</h5>
<a href="#" class="btn btn-danger">Ошибка</a>
</div>
</div>
</div>
</div>
</div>
</body></html>
将卡对准底部。我希望那张卡片的底部对齐，并且我可以水平滚动