我试图在Jade(Pug)中创建一个表单,但是当我的跨度和单选按钮在每个条目的标签上生成时略高于我的标签。它看起来像这样:
我希望所有文字都与标签对齐。这都在一个表格内。我的Jade代码如下:
form.inline-form(ng-submit="submit()")
.option-group(ng-show="visible('checkCountry')")
#checkboxes
label Does this country have a code?
span Yes
input(type='radio', name='checkCountry', value='true', id = 'yes', ng-click="showCountries = false; displayIdentifierInput = true", checked="checked")
span No
input(type='radio', name='checkCountry', value='false', id = 'no',ng-click="showCountries = true; displayIdentifierInput = false")
.option-group(ng-show="showCountries && visible('checkCountry')")
#selectcountry
label Country
select#countryName(required, ng-model="selectedCountry", ng-options="options", ng-change="function()")
.option-group(ng-show="!displayIdentifierInput && visible('checkCountry')")
#autogeneratedtext
label Identifier
span A temporary identifier will be generated automatically
适用的CSS是:
inline-form .option-group label {
text-align: right;
float: left;
width: 192px;
display: block;
margin-right: 10px;
padding: 4px;
}
.option-group label span {
font-weight: normal;
}
.inline-form .option-group label+input, .inline-form .option-group label+textarea, .inline-form .upload {
width: 340px;
float: left;
margin-right: 10px;
}
另外,我怎么能避免使用`& nbps'在无线电输入之间创建我的空间?谢谢!