这是我的html表单:
<form novalidate class="simple-form">
<label>Reviews Min: <input type="number" ng-init="revNum=0" class="form-control review-input" min="0" step="10" ng-model="revNum" /></label>
£<label> Min Price: <input type="number" ng-init="minNum=0" class="form-control price-input" min="0" step="1000" ng-model="minNum" /></label>
£<label> Max Price: <input type="number" ng-init="maxNum=0" class="form-control price-input" min="0" step="1000" ng-model="maxNum" /></label>
<label> <button class="btn btn-primary " style="display:block;" ng-click="updateNumArray(revNum, minNum, maxNum); updateActiveRow()">Filter</button></label>
</form>
这是我的css
.simple-form label{
margin-right: 10px !important;
}
.simple-form button{
background-color: #31708f;
}
.price-input {
width: 150px !important;
}
.review-input{
width: 100px !important;
}
这是chrome中的输出:
在firefox中:
正如你所看到的那样,井号高于firefox中的输入字段。
我该如何解决这个问题。
答案 0 :(得分:0)
要解决此问题,我建议您使用我在此DEMO
上创建的代码使用span
标记简单地包裹英镑符号,并添加一些属性来解决问题。现在它适用于Chrome和FF。
在下面添加了CSS:
.pound {
display: inline-block;
vertical-align: bottom;
margin-bottom: 10px;
}