title: How to move slideshow to the center of page in HTML
body: <pre><code> &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset = "utf-8/"&gt;
          &lt;title&gt; My Student Life &lt;/title&gt;  
  
          &lt;link rel="stylesheet" href="Pan.css"/&gt;  &lt;!--Links to the CSS --&gt;
  
  
      &lt;script type = "text/javascript"&gt;  // JavaScript code 
  
               var slideimages = new Array()      //SlideShow process begins
               imgAlign = "center"
               slideimages[0] = new Image() // create new instance of image object
               slideimages[0].src = "Welcome.jpg" // set image src property to 
               slideimages[1] = new Image()
               slideimages[1].src = "Code.jpg"  //Image source
               slideimages[2] = new Image()
                slideimages[2].src = "books.jpg"
  
  
          &lt;/script&gt;  
  
          &lt;/head&gt;
  
          &lt;body class ="Container" Background = "Background.jpg"&gt;   &lt;!-- Background Images--&gt;
              &lt;div class="headerMenu"&gt;   &lt;!-- Div class for menus --&gt;
  
                          &lt;h1&gt; My Student Life &lt;/h1&gt;
  
  
                          &lt;div id="menu"&gt;  &lt;!-- created Menus--&gt;
              &lt;ul&gt;
                  &lt;a href="WelcomePage.html"/&gt; Welcome &lt;/a&gt;
                  &lt;a href=""/&gt;&lt;/a&gt;                              &lt;!--Menu links--&gt;
                  &lt;a href="Menu.html"/&gt; Menu &lt;/a&gt;      
                  &lt;a href=""/&gt; &lt;/a&gt;
              &lt;/ul&gt;
  
  
  
              &lt;/div&gt;  
  
  
  
  
                     &lt;header&gt;
  
                           &lt;h2 color = "white"&gt; Welcome to my Student Life &lt;/h2&gt; 
  
                    &lt;/header&gt;  
  
      &lt;img src = "Welcome.jpg" width = "500" height ="300" id = "slide" &gt;  &lt;!--Image --&gt; 
  
  
      &lt;script type="text/javascript"&gt;
       var step=0       //starts 
  
      function slideit(){   //function called slideit
  
       if (!document.images)
        return
       document.getElementById('slide').src = slideimages[step].src  //Gets image by ID and follows the sliding process
       if (step&lt;2)
        step++
       else
        step=0
  
       //call function "slideit()" every 2.5 seconds
  
       setTimeout("slideit()",2500)   
      }
  
      slideit()  //Enable the function to perform
  
      &lt;/script&gt;
  
  
  
  
  
  
              &lt;/body&gt;
  
  
  
      &lt;/html&gt;
  </code></pre>
  
  <p>I am creating a project for one of my university course , I have created a slideshow using JS it works perfectly only problem is that the position of image is all the way to the left of screen . I tried padding-left in css but still didnt work I alsi created it in a div class and calld the class in CSS and a still no result. Sorry for my english.</p>