html - How to display a button to center on the same line?
问题描述
I want display a button to the center of the row, having on the same line a text aligned to the left:
<div class="col-xs-1">
<div class="card-header">
<h4 class="card-title">set</h4>
</div>
<div class="text-center">
<button type="button" class="btn btn-primary center-block add-option" id="add-option">test</button>
</div>
</div>
The problem is that I got this result: https://jsfiddle.net/DTcHh/96757/
解决方案
Bootstrap has tons of classes to play with.
One of possible solutions:
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css">
<div class="container-fluid card-header btn-group">
<h4 class="card-title">set</h4>
<div class="text-center container">
<button type="button" class="btn btn-primary center-block add-option" id="add-option">test</button>
</div>
</div>
推荐阅读
- google-apps-script - 网站和文档中的动态值
- genexus - 您可以在同一个 KB 中使用肥皂/休息服务吗?
- android - Android视图整形像底部应用栏,但我需要使用渐变
- python - 如何读取发送到 Django POST 请求的 .sav 文件
- mysql - 如何在 SQL 中使用外键在表中插入值?
- javascript - 如何获取选定选项的文本值并将其用作条件语句?
- firebase - Firebase 实时数据库规则模拟器中的空数据
- java - 如何使用 OSGi 加载/获取包中的所有类?
- sql - 无法获取数据,将 where 子句用于 union 子句的结果
- typescript - 带有 PopperJs 的工具提示,显示未定位的第一个状态