我正在尝试语义UI。我想用统计数据制作一些管理面板卡,但问题是,如果我更改列内数字的字体大小,则会使段溢出... 与卡相同。
这是我的html:
<div class="ui grid container">
<div class="four wide column">
<div class="ui segment">
<div class="ui container stat-number">12</div>
</div>
</div>
</div>
属于html的CSS:
.stat-number {
font-size: 50px;
float: left;
}
.stat-icon {
float: left;
}
答案 0 :(得分:0)
一种解决方案可能是使用"clearing" class。
.stat-number {
font-size: 50px;
float: left;
}
.stat-icon {
float: left;
}
<link href="https://cdnjs.cloudflare.com/ajax/libs/semantic-ui/2.4.1/semantic.min.css" rel="stylesheet" />
<div class="ui grid container">
<div class="four wide column">
<div class="ui segment clearing">
<div class="stat-number">12</div>
<div class="stat-icon">*</div>
</div>
</div>
</div>
我不是语义UI专家。
可能会有一种更合适的方法来用类浮动元素。