Question

我在一个网站上遇到问题我正在为一位让我有点难过的朋友建造。完整的披露我在主题森林中找到了一个主题，因为这是一个免费赠品项目。

问题在于阻止我在较小的断点处选择单线输入。文本区域似乎工作正常。

我设置了codepen（http://codepen.io/misterhamm/pen/BoXZZy）。代码如下：

<form class="contact-comments m-top-50" id="contact-form">
   <div class="row">

       <div class="col-xs-12 col-md-6 form-group">
          <!-- Name -->
          <input type="text" name="name" id="name" class=" form-control" placeholder="Name *" maxlength="100" required="">
       </div>

       <div class="col-xs-12 col-md-6 form-group">
          <!-- Email -->
          <input type="email" name="email" id="email" class=" form-control" placeholder="Email *" maxlength="100" required="">
       </div>


       <div class="form-group col-xs-12 col-md-6">
          <!-- Phone -->
          <input type="text" name="phone" id="phone" class=" form-control" placeholder="Phone" maxlength="100">
       </div>

       <div class="form-group col-xs-12 col-md-6">
          <!-- Subject -->
          <input type="text" name="company" id="company" class=" form-control" placeholder="Company" maxlength="100">
       </div>

       <!-- Comment -->
       <div class="form-group col-md-12">
          <textarea name="comments" id="comments" class="cmnt-text form-control" rows="6" placeholder="Comments" maxlength="400"></textarea>
       </div>

       <!-- Send Button -->
       <div class="form-group col-md-12">
          <button type="submit" class="btn btn-small btn-dark-solid contact-submit">Send Message</button>
       </div>

Answer 1

您需要将col-xs-12类添加到注释div和按钮<。p>

您需要更改以下

<!-- Comment -->
<div class="form-group col-md-12">
...
...

<!-- Send Button -->
<div class="form-group col-md-12">

到此代码

<!-- Comment -->
<div class="form-group col-md-12 col-xs-12 ">
...
... 

<!-- Send Button -->
<div class="form-group col-md-12 col-xs-12 ">

我不知道这个html和css是如何工作的，但是在进行了上述改动之后它才起作用

无法点击平板电脑/手机宽度的输入

1 个答案: