如何解决不能更改宽度或增加引导卡间距?
我有一排使用col-lg-3
的四个引导卡。我似乎无法将任何Boostrap卡的宽度都更改为: 90%;
或w-90
。
现在,它们并排粘在一起。 我应该如何做才能在两张纸牌之间留出空间?我尝试增加页边距,但这会使最后一张纸牌进入下一行。 (仅在下面显示前两个列代码)预先感谢!
<!-- pricing -->
<section class="pricing py-5">
<div class="container">
<div class="row">
<div class="col-lg-3 card card-pricing text-center px-2 mb-4 ">
<span class="h6 w-60 mx-auto px-4 py-1 rounder-bottom bg-primary text-white shadow-lg">Enterprise</span>
<div class="bg-transparent card-header pt-4">
<h3 class="h1 font-weight-normal">$<span class="price">12</span><span class="h6 text-muted ml-2">/per month</span></h3>
</div>
<div class="card-body pt-0">
<ul class="list-unstyled mb-3 pb-2">
<li class="mt-3 p-1">Up to 5 Users</li>
<li class="p-1">Basic support on Github</li>
<li class="p-1">Monthly updates</li>
<li class="p-1">Free cancelation</li>
</ul>
<button type="buton" class="btn btn-primary mb-3">Order now</button>
</div>
</div>
<div class="col-lg-3 card card-pricing text-center px-2 mb-4 ">
<span class="h6 w-60 mx-auto px-4 py-1 rounder-bottom bg-primary text-white shadow-lg">Enterprise</span>
<div class="bg-transparent card-header pt-4">
<h3 class="h1 font-weight-normal">$<span class="price">12</span><span class="h6 text-muted ml-2">/per month</span></h3>
</div>
<div class="card-body pt-0">
<ul class="list-unstyled mb-3 pb-2">
<li class="mt-3 p-1">Up to 5 Users</li>
<li class="p-1">Basic support on Github</li>
<li class="p-1">Monthly updates</li>
<li class="p-1">Free cancelation</li>
</ul>
<button type="buton" class="btn btn-primary mb-3">Order now</button>
</div>
</div>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。