我正在使用 Bootstrap 主题以显示带有标题和标题的框。在 box-header 中,我在 box-toolbar 中添加了一个标签,但它没有正确显示。不知何故,它在盒子标题上方移动。
相关HTML代码:
<div class="main-content">
<div class="container padded">
<div class="row">
<div class="col-md-6">
<div class="box">
<div class="box-header">
<span class="title">Stammdaten</span>
<ul class="box-toolbar">
<li><span class="label label-green">Kunde</span></li>
</ul>
</div>
这是它的样子:
谁能帮我解决这个问题?它与 Bootstrap 主题本身中也存在相同的代码,但它在那里正确显示。谢谢你。
CSS:
.box .box-header .box-toolbar, .box .box-footer .box-toolbar {
margin: 0;
padding: 0;
float: right;
list-style: none;
}
.label-green {
background: #6eb056;
background-image:url('data:something...');
background-size: 100%;
background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #8cc079), color-stop(100%, #6eb056));
background-image: -webkit-linear-gradient(top, #8cc079, #6eb056);
background-image: -moz-linear-gradient(top, #8cc079, #6eb056);
background-image: -o-linear-gradient(top, #8cc079, #6eb056);
background-image: linear-gradient(top, #8cc079, #6eb056);
-webkit-box-shadow: 0 1px 0 #f7f7f7, inset 0 1px 1px #80b96b;
-moz-box-shadow: 0 1px 0 #f7f7f7, inset 0 1px 1px #80b96b;
box-shadow: 0 1px 0 #f7f7f7, inset 0 1px 1px #80b96b;
}