Üç sütun arka planda görünmeyen Önyükleme görüntüsü

Question

Üç sütunun arka planında bir görüntüyü tam genişlikte göstermeye çalışıyorum. Sanırım üç sütunu bir div'a sardım ve div'a bir arka plan koydum, bu olurdu, ama göstermiyor. http://www.bootply.com/BT0SWRh3aq

İşte benim kod::

   <div id="bg-pink-data-points"> 
      <div class="col-md-4 col-xs-12"> 
       <h3>RESEARCH</h3> 
       <p>The systematic investigation into and study of materials and sources in order to establish facts and reach new conclusions</p> 
      </div> 
      <div class="col-md-4 col-xs-12"> 
       <h3>WRITE</h3> 
       <p>Mark (letters, words, or other symbols) on a surface, typically paper, with a pen, pencil, or similar implement.</p> 
      </div> 
      <div class="col-md-4 col-xs-12"> 
       <h3>DISCOVER</h3> 
       <p>In order to protect access to your account, we need to know who you are. Please provide details about the Primary cardmember as well as your Discover card</p> 
      </div> 
       </div> 

İşte css var:

#bg-pink-data-points { 
    background: url(https://www.planwallpaper.com/static/images/Wallpapers-for-Background-HD-Wallpaper-1080x607.jpg) no-repeat center center; 
    background-size: cover; 
} 

Answer 1

div yüksekliği için herhangi bir değer atanır almıyor

İşte benim bootply bu. Bunu sabit bir yüksekliğe ayarlayabilir veya css'yi biraz değiştirmenizi ve satır veya col-xs-12 gibi bir sarmalayıcı sınıfı eklemenizi tavsiye ederim.

CSS Değişimi:

 

    #bg-pink-data-points { 
      background-image: url("https://www.planwallpaper.com/static/images/Wallpapers-for-Background-HD-Wallpaper-1080x607.jpg"); 
      background-size: cover; 
     } 

HTML Değişimi:

 

    div class="row" id="bg-pink-data-points">