design iput form

shemi · #1 (**permalink**) 10-01-09, 03:22 AM

hi all,
help me to design an input form like this .

wirehopper · #2 (**permalink**) 10-01-09, 07:51 AM

Please post some code, unless you want some one to do it for you, in which case, you should post under Job Offers and Assistance.

maneetpuri · #3 (**permalink**) 10-29-09, 05:07 AM

hi,

below is the code tpo create a basic login box.
-------------------------------------------------------------------------------

HTML Code:

<html xml:lang="en" xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta name="generator"
    content="HTML Tidy for Linux/x86 (vers 1st March 2002), see www.w3.org" />
    <meta name="editor" content="Emacs 21" />
    <meta name="author" content="Gary Turner" />
    <meta http-equiv="content-type"
    content="text/html; charset=ISO-8859-1" />

    <title>Using CSS to Format a Form</title>

<style type="text/css">
/*<![CDATA[*/

form {
    position: relative;
    width: 20em;
    margin: 1em auto 0;
    }

legend {
    font-size: .8em;
    font-variant: small-caps;
    }

form h2 {
    font: 1.2em Tahoma, Arial, Helvetica, sans-serif;
    text-align: center;
    letter-spacing: .25em;
    }

.lbl {
    width: 48%;
    float: left;
    text-align: right;
    line-height: 1.2em;
    margin-bottom: 0.2em;
    }

.npt {
    width: 48%;
    float: right;
    text-align: left;
    line-height: 1.2em;
    margin-bottom: 0.2em;
    }

.npt input {
    width: 8em;
    }

br {
    clear: both;
    }

.clearing {
    font-size: 0;
    clear: both;
    }

/*]]>*/
</style>
  </head>

  <body>
    <form method="get" action="login.php">
      <fieldset>
        <legend>Login</legend> 

        <h2>Please Sign In</h2>

        <div class="lbl">
          <label for="usrname">Username:&nbsp;&nbsp;</label>
        </div>

        <div class="npt">
          <input type="text" id="usrname" />
        </div>
        <br />
         

        <div class="lbl">

          <label for="passwd">Password:&nbsp;&nbsp;</label>
        </div>

        <div class="npt">
          <input type="password" id="passwd" />
        </div>
        <br />

        <div class="npt">

          <input type="submit" value="Log In" />
        </div>

        <p class="clearing">&nbsp;</p>
      </fieldset>
    </form>
  </body>
</html>

------------------------------------------------------------------

Hope this helps,
Cheers,