title: positioning the input text box in the center
body: <p>In the code given below, I need to position the userid box in the center. I could not do this after many attempts. Sorry for being so naive. <br>
  My HTML and css file are as follows:</p>
  
  <pre><code>    &lt;!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"&gt;
  &lt;head&gt;
  &lt;link rel="stylesheet" type="text/css" href="styledel.css" /&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
  &lt;input type="text" name="userid" id="userid"&gt;  &lt;!-- this need to go in the center --&gt;
  &lt;br/&gt;&lt;br/&gt;&lt;br/&gt;
  
  
  &lt;form action="http://localhost" method="post" name="form""&gt;
          &lt;label for="name"&gt;Name&lt;/label&gt;
                  &lt;input type="text" id="name" name="name" disabled="disabled" /&gt;
                  &lt;br&gt;&lt;/br&gt;
  
                  &lt;label for="email"&gt;E - mail&lt;/label&gt;
                  &lt;input type="text" name="email"&gt;
                  &lt;br&gt;&lt;/br&gt;
  
                  &lt;label for="password"&gt;Select Password&lt;/label&gt;                
                  &lt;input type="password" name="password" &gt;
                  &lt;br&gt;&lt;/br&gt;
  
                  &lt;label for="password2"&gt;Retype Password&lt;/label&gt;
                  &lt;input type="password" name="password2" &gt;
                  &lt;br&gt;&lt;/br&gt;
      &lt;input type="submit" value="Submit" /&gt;
  &lt;/form&gt;
  
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>My css file is as follows: <br>
  styledel.css</p>
  
  <pre><code>* {
      margin: 0;
      padding: 0;
  }
  
  body {
      font-family: Helvetica, sans-serif;
      }
  
  #page-wrap {    /*showing white background*/ 
      width: 600px;
      background: white;
      padding: 20px 50px 20px 50px;
      margin: 20px auto;
      min-height: 500px;
      height: auto !important;
      height: 500px;
  }
  
  form, br {
      clear: left;
      margin: 0;
      padding: 0;
  }
  
  input.form_element {
      width: 221px;
      background: transparent url('bg.jpg') no-repeat;
      color : #747862;
      height:20px;
      border:0;
      padding:4px 8px;
      margin-bottom:0px;
  }
  
  .checkun{
      width: 150px;
      background: transparent url('bg.jpg') no-repeat;
      color : #747862;
      height:20px;
      border:1px solid blue;
      padding:4px 10px;
      margin-bottom:0px;
      position: right;
  }
  
  label, input {
      width: 160px;
      float: left;
      font: 11px bold Tahoma, Arial, sans-serif;
      margin: 1px;
      padding: 2px;
  }
  
  label {
      font: 14px bold Tahoma, Arial, sans-serif;
      background: #eeeeee;
  }
  
  input {
      width: 200px;
      padding: 2px;
      border: 1px solid #aaa;
  }
  </code></pre>
  
  <p>Thanks in advance.</p>