twitter-bootstrap - 如何更改按钮的外观
问题描述
我在这里有这个按钮“撤回”我怎样才能使名称适合 1 行中的按钮?
这是代码
<div class="col-sm-4 pb-3">
<!-- Card -->
<div class="card card-image h-90 " >
<!-- Content -->
<div class="text-white text-center d-flex align-items-center rgba-black-strong py-5 px-3 justify-content-center ">
<div>
<h5 class="pink-text"><i class="fas fa-chart-line"></i> Your Rewards</h5>
<h3 class="card-title pt-2"><strong>Earned AGI</strong></h3>
<p>AGI Dividends</p>
<h3 id="myDividends">0</h3>
<br>
<div class="row">
<div class="col-lg-6 pb-3">
<button type="button" class="btn btn-primary btn-block" id="reinvest" onclick="reinvest()" >REINVEST</button>
</div>
<div class="col-lg-6 ">
<button type="button" class="btn btn-primary btn-block" id="withdraw" onclick="withdraw()">WITHDRAW</button>
</div>
</div>
</div>
</div>
这是图像
解决方案
尝试添加 CSS white-space: nowrap 以从不换行 或者您可以减少该按钮的填充。
.btn {
white-space: nowrap;
text-align: center;
}
或者
.btn {
padding: 0;
text-align: center;
}
推荐阅读
- c++ - 在'declare&initialize'部分使用运算符“/=”
- mongodb - Mongoose findbyid / find({id: "..."}) 返回 Null
- ruby-on-rails - 错误消息“NoMethodError in Posts#new”
- javascript - 反转正则表达式中的捕获组
- python - 创建一个python脚本并使用grep命令?
- bootstrap-4 - Bootstrap4 - 下拉菜单不会显示
- php - 如何在laravel的路由上注册api
- css - 为什么 Font Awesome 不能在我的 Shadow DOM 中工作?
- reactjs - Fetch API 无法加载 webpack://... 错误
- python - 如何在没有逗号的行中添加列表的偶数元素