移动浏览器

Question

在我的网站http://createabundance.ca上，在点击任何橙色按钮时显示的付款表单中，文本字段无法在移动版Safari或Chrome中选择，但在桌面版Safari和chrome上无问题

屏幕截图： http://d.pr/i/nrBu

关于问题可能是什么想法？

Answer 1

您有这样的表单字段

<div class="form-row">
    <div class="col-xs-12 form-group required">
        <input name="email" class="form-control" size="4" placeholder="邮件地址" type="email">
    </div>
</div>

从col-xs-12移除<div class="col-xs-12 form-group required">并将其放在单独的div <div class="col-xs-12">中，如下所示

<div class="form-row">
    <div class="col-xs-12">
        <div class="form-group required">
            <input name="name" class="form-control" size="4" placeholder="姓名" type="text">
        </div>
    </div>
</div>

它将解决在移动设备中打开表单时的问题

旁注：class="form-row"没有css属性，所以完全删除了这个<div class="form-row">因为它没有用处

<div class="col-xs-12">
    <div class="form-group required">
        <input name="name" class="form-control" size="4" placeholder="姓名" type="text">
    </div>
</div>

但是如果你想使用<div class="form-row">那么

<div class="col-xs-12">
    <div class="form-row">
        <div class="form-group required">
            <input name="name" class="form-control" size="4" placeholder="姓名" type="text">
        </div>
    </div>
</div>