我有一个两行的面板。每行有2列。我需要的是垂直对齐左边的文本(第1列)与右边选择的高度(第2列)。垂直对齐和实心分隔线
这是我有:
我也没有这样的划分各行的默认行。我买了一个模板,可我有一个覆盖在一些css文件,但我什么也看不到
为面板的代码是:
<div class="wrapper_indent">
@foreach($dias as $dia)
<div class="panel panel-default">
<div class="form-control header-card">
{{$dia['nombre'] }}
</div>
<div class="row">
<div class="col-sm-6">
<span class="body-card">Primer turno</span>
</div>
<div class="col-sm-6">
<select name="example" class="form-control selecthora">
@foreach($dia['horarios'] as $horario)
<option {{ ($dia['valorInicio']===$horario)?'selected="selected"':''}} value="{{$dia['valorInicio']}}">{{$horario}}</option>
@endforeach
</select>
</div>
</div>
<div class="row">
<div class="col-sm-6">
<span class="body-card">Último turno</span>
</div>
<div class="col-sm-6">
<select name="example" class="form-control selecthora">
@foreach($dia['horarios'] as $horario)
<option {{ ($dia['valorFin']===$horario)?'selected="selected"':''}} value="{{$dia['valorFin']}}">{{$horario}}</option>
@endforeach
</select>
</div>
</div>
</div>
@endforeach
</div><!-- End wrapper_indent -->
我的自定义CSS为试图解决的问题是以下内容:
.body-card{
font-size: 12px;
display: inline-block;
vertical-align: middle;
font-weight: bold;
}
感谢您的帮助!
这是更好地张贴真正的HTML,而不是服务器模板 – vals
这才是真正的HTML –