title: CSS dual background issues
body: <pre><code> &lt;!DOCTYPE html&gt;
   &lt;html lang="en"&gt;
   &lt;head&gt;
   &lt;meta name="description" content=""&gt;
   &lt;meta name="author" content=""&gt;
   &lt;title&gt;Main Website&lt;/title&gt;
   &lt;link href="css/main.css" rel="stylesheet"&gt;
   &lt;/head&gt;
  
  
  
      &lt;body&gt;
      &lt;nav&gt;
      &lt;div&gt;  
          &lt;div&gt;
              &lt;ul&gt;
                &lt;li&gt;&lt;a class="active" href="index.html"&gt;Home&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="mens_clothing.html"&gt;Mens Clothing&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="women_clothing.html"&gt;Womens Clothng&lt;/a&gt;&lt;/li&gt;
                &lt;li&gt;&lt;a href="boys_clothing.html"&gt;Boys Clothing&lt;/a&gt;&lt;/li&gt;
              &lt;/ul&gt;
          &lt;/div&gt;
  
      &lt;/div&gt;
  
  &lt;/nav&gt;
  
  
  &lt;div class="container"&gt;
  
      &lt;div&gt;
  
  
          &lt;div&gt;
  
              &lt;div class="accordion"&gt;
                      &lt;ul&gt;
                          &lt;li&gt;
                              &lt;div class="caption"&gt;&lt;a href="#"&gt;Slide 1&lt;/a&gt;&lt;/div&gt;
                              &lt;a href="#"&gt;
                          &lt;img src='Slider_Image1.jpg'/&gt;&lt;/a&gt;
                          &lt;/li&gt;
  
                      &lt;li&gt;
                              &lt;div class="caption"&gt;&lt;a href="#"&gt;Slide 2&lt;/a&gt;&lt;/div&gt;
                              &lt;a href="#"&gt;
                          &lt;img src='Slider_Image2.jpg'/&gt;&lt;/a&gt;
                          &lt;/li&gt;
  
                      &lt;li&gt;
                              &lt;div class="caption"&gt;&lt;a href="#"&gt;Slide 3&lt;/a&gt;&lt;/div&gt;
                              &lt;a href="#"&gt;
                          &lt;img src='Slider_Image3.jpg'/&gt;&lt;/a&gt;
                          &lt;/li&gt;
  
                      &lt;/ul&gt;
              &lt;/div&gt;
  
              &lt;/div&gt;
  
              &lt;div&gt;
  
                   &lt;div class="centre , fade ,"&gt;
                      &lt;div class="thumbnail"&gt;
                       &lt;a href="Nike_Shoes1.html"&gt;
                          &lt;img src="Image1.jpg" alt=""&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;a href="Nike_Trainers.html"&gt;
                          &lt;img src="Image2.jpg" alt=""&gt;
  
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                   &lt;div class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;img src="Image3.jpg" alt=""&gt;   
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                   &lt;div  class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;a href="new.html"&gt;
                          &lt;img src="Mens_Clothing.jpg" alt="Mens Clothing"&gt;  
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                   &lt;div  class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;a href="women_clothing.html"&gt;
                          &lt;img src="Womens_Clothing.jpg" alt="Womens Clothing"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
  
                   &lt;div  class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;a href="boys_clothing.html"&gt;
                          &lt;img src="Boys_Clothing.jpg" alt="Boys Clothing"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                   &lt;div  class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;img src="Converse_clothing.jpg" alt="Converse Clothing"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;div  class="centre , fade"&gt;
                      &lt;div class="thumbnail"&gt;
                          &lt;img src="Adidas_clothing.jpg" alt="Adidas Clothing"&gt;
                      &lt;/div&gt;
                  &lt;/div&gt;
  
                  &lt;/div&gt;
  
              &lt;/div&gt;
  
          &lt;/div&gt;
  
      &lt;/div&gt;
  
  &lt;/div&gt;
  
  
  &lt;div&gt;
      &lt;!-- Footer --&gt;
      &lt;footer&gt;
  
  
  
      &lt;/footer&gt;
  
  &lt;/div&gt;
  </code></pre>
  
  <p></p>
  
  <p></p>
  
  <p>Here is the code for a website I am developing and I am trying to add images for the background. What I am looking to do is add 2 images on either side of the webpage, I am not sure on how to go about this also while trying to add an image as my background I see a white area the image is not set as the background, any help is appreciated.</p>