2015-11-06 30 views
0

所以,我是新來的響應式設計,並將表單代碼放在一個圖像的頂部,它不會顯示在移動視圖中。它看起來發生在990像素左右,表格將失去視覺。我無法確定@media或什麼CSS類將在某個寬度後隱藏表單的位置。div在手機視圖中消失

網址: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 -->

+0

請在這裏張貼CSS – cocoa

回答

0

你與slider-caption類的DIV也有visible-md visible-lg,你應該刪除這2個類。基本上,它使div僅在992px寬度或更大的屏幕上可見。

您可以瞭解更多關於它的bootstrap documentation

0

原因是「消失」是因爲父元素:<div class="slider-caption visible-md visible-lg">

它得到display: none !important;992px這是一個bootstrap斷點。具體而言,它是正在做的visible-*類。 Read about that in the Bootstrap docs