html - 无法将按钮组中的按钮对齐到 MVC 的顶部
问题描述
我很难将左侧按钮中的文本移到顶部(风险级别 3)。它是 MVC 中的 Web 应用程序,我在引导程序中使用按钮组。我试过垂直对齐和顶部:0。但仍然没有运气。
我在检查元素时尝试了很多东西,但没有运气。其他两个按钮中的 span 标签似乎是全宽的。但最左边按钮中的 span 标签似乎只是文本的宽度。
代码:
@foreach (GRATT.DTO.ClinicalAreas ca in Model.ClinicalAreasList)
{
<div class="btn-group col-lg-4" role="group" aria-label="First group">
<div class="btn-toolbar" role="toolbar" style="width:100%" aria-label="Toolbar with button groups">
<button type="button" id="btnClinical" class="btn btn-success btn-block" onclick="GetId(this)">
<h4>Risk Level: @ca.ClinicaLevel</h4>
<span>@ca.ClinicalDescription</span>
</button>
</div>
</div>
解决方案
有多种方法可以解决这个问题,下面是一个css flex-box 解决方案,因为按钮有一个 id 选择器,我用它来设置按钮的样式。
#btnClinical {
display: flex;
flex-direction: column;
justify-content: flex-start;
align-items: center;
}
推荐阅读
- c++ - 使用 ODBC 获取真实数据类型,将数据转换为更高精度
- python - Py2neo (V4) - AttributeError: 'Graph' 对象没有属性 'find_one'
- javascript - Angular JS $timeout 和 $scope 函数通信
- java - 使用 SpringSecurity 在 REST API 中验证 IP 地址
- visual-studio-2015 - ExtensionOf RdlContract 在 AX7 中使用 SysOperation
- python - 如何使用 Python 中的日志记录将一些消息记录到日志文件并将一些消息记录到标准输出
- javascript - Cordova 应用程序安装在 android 上崩溃
- mysql - 如何在mysql中使用过程
- python - 获取 xml soap 响应而不是原始数据
- python - *python 构造函数中的参数