휴대 전화의 양식 입력란을 클릭 할 수 없습니다.

Question

여기에 웹 사이트가 있습니다 : http://www.hotelsunlimited.tech/ 다음은 문제가 있다고 생각되는 코드입니다. 문제는 작은 화면에서 데모 요청을 클릭하면 필드를 클릭 할 수없는 경우입니다 ... 문제는 Z- 색인에 대한 어딘가에 있다고 생각합니다. 거의 모든 게시물/방법을 시도했지만 해결할 수 없었습니다.

<div id="requst_demo" class="modal fade in" role="dialog" style="display: block; padding-left: 0px;"> 
      <div class="modal-dialog"> 
       <!-- modal content start --> 
       <div class="modal-content"> 
        <div class="modal-header bg-gray"> 
         <button type="button" class="close" data-dismiss="modal">×</button> 
      <script type="text/javascript">var submitted=false;</script> 
      <h5 class="modal-title text-center" id="requestDemoDisplay"><!-- <i class="fa fa-lock fa-fw"> --> Request Demo</h5> 
     </div> 
     <div class="modal-body_bg col-md-12"> 
     <div class="contact contact-us-one"> 
     <div class="col-sm-12 col-xs-12 text-center mb20"> 
     <h4 class="pb25 bb-solid-1 text-uppercase"> 
     Help us to Reach You 
      <small class="text-lowercase">Please complete the form and we will get back to you.</small> 
     </h4> 
     </div> 
     <iframe name="hidden_iframe" id="hidden_iframe" style="display:none;" onload="if(submitted){$('#inputInfo').hide();$('#requestDemoDisplay').hide();$('#successMessage').show();}"> </iframe> 
     <form name="contactForm" id="ss-form" action="https://docs.google.com/forms/d/17hNuB00okyMsEvvNrirQCZzZtwEEGmF1trFfBIwvKgI/formResponse" target="hidden_iframe" onsubmit="submitted=true" method="POST"> 
     <div id="inputInfo"> 
     <!-- fullname start --> 
     <div class="col-md-6 col-sm-6 col-xs-12"> 
     <div class="form-group"> 
     <input type="text" name="entry.301789256" id="entry_301789256" class="input-md input-rounded form-control" placeholder="Fullname" maxlength="100" required=""> 
     </div> 
     </div> 
     <!-- fullname end --> 
<!-- email start --> 
<div class="col-md-6 col-sm-6 col-xs-12"> 
<div class="form-group"> 
    <input type="email" name="entry.1752605527" id="entry_1752605527" class="input-md input-rounded form-control" placeholder="Work Email-ID" maxlength="100" required=""> 
</div> 
</div> 
<!-- email end --> 
    <!-- textarea start --> 
<div class="col-sm-12"> 
<textarea class="form-control" name="entry.1630854875" id="entry_1630854875" placeholder="Any Question" rows="7" required=""></textarea> 
</div> 
<!-- textarea end --> 

<!-- button start --> 
<div class="col-sm-12 mt10 text-center"> 
<button type="submit" value="Submit" name="sendMessage" id="sendMessage" class="button button-md button-block button-grad-stellar">Send Message</button> 
       </div> 
       <!-- button end --> 
        </div> <!---end of inputInfo--> 
      <div id="sendingMessage" class="statusMessage sending-message"> 
      <p>Sending your message. Please wait...</p> 
      </div> 
      <div id="successMessage" class="statusMessage success-message"> 
      <p>Thanks for sending your message! We'll get back to you shortly.</p> 
      </div> 
      <div id="failureMessage" class="statusMessage failure-message"> 
      <p>There was a problem sending your message. Please try again.</p> 
      </div> 
      <div id="incompleteMessage" class="statusMessage"> 
      <p>Please complete all the fields in the form before sending.</p> 
        </div> 
      </form> 
     <div id="successMessage2" class="statusMessage success-message"> 
     <p>Thanks for sending your message! We'll get back to you shortly.</p> 
             </div> 
         </div><!-- div contact end --> 
        </div><!-- col end --> 
       </div> 
       <!-- modal content end --> 
      </div> 
     </div> 

Answer 1

다음과 같은 변경 사항을 관리자가 적용하여 트릭을했는데 문제가 있으면 알려주세요.

은 다음과 CSS를

.modal-dialog, .modal-content{height: 100%;} 

위의 라인은 모양이 아니라 텍스트 입력 문제를 해결을 추가합니다. 다음 행 아래의 텍스트 영역을 포함하는 열은 첫번째 두 개의 입력 필드를 포함하는 한계 이상으로 연장되기 때문이다

#inputInfo .col-sm-12{clear: both;} 

응답하지 입력 상자를 고정한다.