title: How do I get my logo, slideshow and image to cover my entire screen no matter the window size
body: <p>I would like to get all three of these divs (logo, slideshow, and subslider) to fit the entire screen window no matter the size. I basically want to mimic the background:cover action in CSS but with all three of these elements. From my research I need to do something in javascript but I just can't seem to get it to work no matter what I try. I would also like to note that I am using drupal if that changes anything... Despite reading a lot on the subject, I'm way out of my comfort zone when it comes to trying to understand window resizing issues, any help, advice, and code snippets would be a godsend please!</p>
  
  <p><img src="https://i.stack.imgur.com/ZjvHv.jpg" alt="All images and slideshow are centered and stacked horizontally :) "></p>
  
  <pre><code>&lt;div class="logo"&gt;
  &lt;img src="sites/all/themes/cpd pro/images/cpd.jpg" alt="Center for Passion Development"&gt;
  &lt;/div&gt;
  &lt;!-- *************SLIDESHOW***************-- --&gt;
  &lt;div id="slider"&gt;
  &lt;img src="sites/all/themes/cpd pro/images/slide1.jpg"/&gt;
  &lt;img src="sites/all/themes/cpd pro/images/slide2.jpg"/&gt;
  &lt;img src="sites/all/themes/cpd pro/images/slide3.jpg"/&gt;
  &lt;img src="sites/all/themes/cpd pro/images/slide4.jpg"/&gt;
  &lt;img src="sites/all/themes/cpd pro/images/slide5.jpg"/&gt;
  &lt;/div&gt;  
  &lt;!-- *************BELOW SLIDESHOW IMAGE***************-- --&gt;
  &lt;div class="subslider"&gt;
  &lt;h5&gt;&lt;img src="sites/all/themes/cpd pro/images/nav-wrap.png" alt="navigation"&gt;  &lt;/h5&gt;
  &lt;/div&gt;
  </code></pre>