Jump to content

how to make a valid input field?


xcoderx

Recommended Posts

ok how do i do this in a valid xhtml by using css?

 

username: <input type="text" name="username" value="" /> Password: <input type="password" name="password" value="" />

 

i want it without using any break. dont know it just will not be valid till i use p or h1 etc.

Link to comment
Share on other sites

i want it without using any break. dont know it just will not be valid till i use p or h1 etc.

 

<br /> tags are perfectly valid xhtml if thats what your eluding too. Are you sure you should be using xhtml in the first place?

Link to comment
Share on other sites

You can use Table and Div layout for that.

 

eg

 

<div>

<form action="formProcessor.php" method="post">

    Name : <input type="text" name="txtUsername" /> <br />

    Password : <input type="password" name="txtPassword" /><br />

 

  <input type="button" value="submit">     

  <input type="reset" value="reset">

   

</form>

</div>

 

 

or

 

<form action="formProcessor.php" method="post">

<table width="500" border="0" cellpadding="2" cellspacing="2" align="center">

  <tr>

      <td>Name</td>

      <td><input type="text" name="txtUsername" /> </td>

  </tr>

  <tr>

      <td>Password</td>

      <td><input type="password" name="txtPassword" /> </td>

  </tr>

</table>

</form>

 

 

Is this what you are looking for ?

 

Or else make your question clear or send your code and tell what you want to do.

 

 

Link to comment
Share on other sites

It may look a bit longer with css.

 

 

 

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />

<title>Form</title>

<style type="text/css">

 

.main{

margin-left:auto;

margin-right:auto;

width:500px;

height:150px;

}

 

.fields

{

width:170px;

border:solid #CCCCCC 1px;

}

 

.button

{

width:80px;

background-color:#FFFFFF;

border:none;

display:block;

float:right;

color:#0066CC;

margin-top:30px;

}

 

.button:hover

{

color:#FF3300;

}

 

.legend

{

font-family:Arial, Helvetica, sans-serif;

font-size:14px;

color:#FF6600;

}

 

fieldset

{

width:500px;

}

 

</style>

</head>

 

<body>

<div class="main">

<fieldset>

<legend class="legend">Login Details</legend>

 

<form action="formProcess.php" method="post">

<label style="font-family:Arial, Helvetica, sans-serif; font-size:12px;">Username : <input type="text" name="txtUsername" class="fields" /></label>

<label style="font-family:Arial, Helvetica, sans-serif; font-size:12px; margin-left:10px;">Password : <input type="password" name="txtPassword" class="fields" /></label>

<input type="submit" value="Login" class="button">

</form>

</fieldset>

</div>

</body>

</html>

 

copy and save it as .html file and check.

Link to comment
Share on other sites

ok problem here, there is error in it according to html validator.

 

Validation Output: 7 Errors

Line 60, Column 51: end tag for "input" omitted, but OMITTAG NO was specified

<input type="submit" value="Login" class="button">

 

 

You may have neglected to close an element, or perhaps you meant to "self-close" an element, that is, ending it with "/>" instead of ">".

Line 60, Column 1: start tag was here

<input type="submit" value="Login" class="button">

Line 61, Column 7: Opening and ending tag mismatch: input line 60 and form

</form>

 

Line 62, Column 11: Opening and ending tag mismatch: form line 57 and fieldset

</fieldset>

 

Line 63, Column 6: Opening and ending tag mismatch: fieldset line 54 and div

</div>

 

Line 64, Column 7: Opening and ending tag mismatch: div line 53 and body

</body>

 

Line 65, Column 7: Opening and ending tag mismatch: body line 52 and html

</html>

 

Line 65, Column 7: Premature end of data in tag html line 2

</html>

 

 

 

how to fix this?

Link to comment
Share on other sites

close all the input field like this

 

<input type="text" name="" />

 

Just ignore the others

 

it's valide and it will not create any problem for you.

Validator have their own standard and i have my own standard too

Link to comment
Share on other sites

Archived

This topic is now archived and is closed to further replies.

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue.