如何将引导卡漂浮在单列中?我正在尝试使用2列进行博客布局。左侧的第一列用于显示博客文章,右侧的列用于搜索,个人资料等。我想将卡片作为两辆车连续地悬浮在左侧的列中,但是当我尝试时就像一个堆叠的布局,一个在另一个的底部。
这是HTML代码。
<div class="recent">
<div class="row">
<div class="col-md-10">
<h1>Recent Posts</h1>
<div class="card" style="width: 25rem;">
<img src="{{ url_for('static',filename = 'uploads/blog/' + first['cover_img'])}}" class="card-img-top" alt="..." height="30%">
<div class="card-body">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
</div>
<div class="card" style="width: 25rem;">
<img src="{{ url_for('static',filename = 'uploads/blog/' + first['cover_img'])}}" class="card-img-top" alt="..." height="30%">
<div class="card-body">
<p class="card-text">Some quick example text to build on the card title and make up the bulk of the card's content.</p>
</div>
</div>
</div>
<div class="col-md-2">
</div>
</div>
</div>
我尝试了ml-auto
和float-left
,但这没用