如何解决如何在mac中间对齐输入元素文本
我使用 Slate Pro Regular 和 Slate Pro Bold 字体开发了一个网站。它在 Windows 中运行良好,但在 Mac 中,输入元素文本向上推。请查找屏幕截图以供参考 Input element in Windows 和 Alignment issue in Mac chrome
我在下面试过 How to vertically align text in input type="text"? 和 https://css-tricks.com/forums/topic/vertical-align-on-text-input/
请任何人帮我解决 Mac 中的输入元素对齐问题。
.container {
max-width: 1040px;
margin: 0 auto;
}
.row {
display: -ms-flexBox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}
.form-input {
margin-bottom: 10px;
font-size: 16px;
font-family: 'SlatePro Bold';
color: #565656;
}
.form-control {
display: block;
width: 100%;
height: calc(1.5em + .75rem + 2px);
padding: .375rem .75rem;
font-size: 1rem;
font-weight: 400;
line-height: 1.5;
color: #495057;
background-color: #fff;
background-clip: padding-Box;
border: 1px solid #ced4da;
border-radius: .25rem;
transition: border-color .15s ease-in-out,Box-shadow .15s ease-in-out;
}
.enroll-form-input.form-input input:not([type='radio']) {
border: 1px solid #2b5795;
font-family: 'SlatePro Regular';
width: 100%;
}
<section class="enroll-doctor">
<div class="container">
<div class="row form-center">
<div class="col-md-8 col-sm-12">
<div class="form-input enroll-form-input">
<label for="licensefname">License first name</label>
<input type="text" class="form-control" name="License_First_Name__c" id="licensefname" placeholder="*John" value="" maxlength="100" data-parsley-required="true" data-parsley-required-message="*License first name required" data-parsley-pattern="/^[a-zA-Z]+(([',. -][a-zA-Z ])?[a-zA-Z]*)*$/g" data-parsley-pattern-message="*Invalid License first name">
</div>
</div>
<div class="col-md-4 col-sm-12">
<div class="form-input enroll-form-input">
<label for="licenselname">License last name</label>
<input type="text" class="form-control" name="License_Last_Name__c" id="licenselname" placeholder="*Smith" value="" maxlength="100" data-parsley-required="true" data-parsley-required-message="*License last name required" data-parsley-pattern="/^[a-zA-Z]+(([',. -][a-zA-Z ])?[a-zA-Z]*)*$/g" data-parsley-pattern-message="*Valid license last name required">
</div>
</div>
</div>
</div>
</section>
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。