html - div在移动 View 中消失

Question

所以，我是响应式设计的新手，将表单代码放在一张图片的顶部，它不会显示在移动 View 中。表格似乎会在 990px​​ 宽的范围内消失。当表单达到一定宽度后，我无法确定 @media 或什么 CSS 类会将表单隐藏在哪里。

网址:subscribe.ign.com/social

   <div class="site-slider">
                <div class="slider">
                    <div class="flexslider">
                        <ul class="slides">
                            <li>
                                <div class="overlay"></div>
                                <img src="http://static.ziffdavis.com.s3.amazonaws.com/cimages/blackfriday/Black-Friday-Email-Landing-Pages/black-friday-chaos-store-1600x750.png" alt="">
                                <div class="slider-caption visible-md visible-lg">
                              <div id="bouncex" align="center" style="width:558px; margin: 0 auto; ">
                              
                              <!--LYRIS-->
                              <div class="heading-section col-md-12 text-center">
                        <div class="contact-form" style="background-color:#000 !important; padding: 25px">
                        <h2 style="text-transform:capitalize; font-size:34px">BLACK FRIDAY IS COMING</h2>
                        <br/>
                        <p style="text-transform:capitalize; font-size:28px">UP TO 50% OFF</p>
                        <h2 style="text-transform:capitalize; font-size:24px">ON HOTTEST GAMES AND TECH DEALS DELIVERED TO YOUR INBOX</h2>
                            <form name="contactform" id="contactform">
                               <p><input name="txtEmail" id="txtEmail" type="text" placeholder="Your Email"> 
                                </p>
                                 <input type="button" class="mainBtn" name="btnSubscribe" id="btnSubscribe" value="Subscribe">
                                 <input type="hidden" name="txtList" id="txtList" size="70" value="ign-deals" />
                                 <p style="color:#FFF;font-size:14px">Subscribing to a newsletter indicates your consent <br/>to our&nbsp;<a style="color:#d3222a; text-decoration:underline" href="http://www.ziffdavis.com/terms-of-use" title="Terms of Use" rel="nofollow">User Agreement</a>&nbsp;and&nbsp;<a style="color:#d3222a; text-decoration:underline" href="http://www.ziffdavis.com/privacy-policy" title="Privacy Policy" rel="nofollow">Privacy Policy</a><span id="article-punctuation" class="article-punctuation">
                                    
                                </span></p>
                            </form>
                        </div> <!-- /.contact-form -->
                    </div> <!-- END LYRIS -->
                              </div>
                                  </div>
                                    
                               
                            </li>
                           
                        </ul>
                    </div> <!-- /.flexslider -->
                </div> <!-- /.slider -->
            </div> <!-- /.site-slider -->

Answer 1

只需设置:

<ul class="slides" style="list-style:none; padding-left: 0;">

<img style="width: 100%; " src="your url" alt="">

立即尝试: http://codepen.io/anon/pen/qOJEaw