Chris-topher
07-06-2005, 08:27 PM
Hi.
I am in the middle of creating an order form. What I really need is the name, address, town (etc) down the left hand side neatly...this I can do. The problem now is getting the text boxes aligned down the right hand side, is there a indent tag or like a tab i can use to do this. I didn't want to put it into a table. An idea like a tab would be great. Any suggestions please.
Regards
Chris
Beeper
07-06-2005, 09:30 PM
You might have to play with the widths a bit but...
CSS
/* FORMS */
input.txt {
color:#C41030;
background-color:#FFFFFF;
border: 1px inset #C41030;
width: 180px;
}
input.btn {
color:#FFFFFF;
background-color:#C41030;
border: 1px inset #C41030;
width: 145px;
background: #C41030;
font-size:80%;
font-weight:bold;
}
form select {
color:#C41030;
background-color:#FFFFFF;
border: 1px inset #C41030;
width: 145px;
}
form p {
clear:left;
margin:0; padding:0;
padding-top:5px;
}
form p label {
float:left;
width:100px;
}
You'll have to do the style for each type of input... :p but you get the idea
FORM
<form action="doSomething" name="contact" id="contact" method="post">
<p>
<label for="name">Name :</label>
<input name="name" type="text" size="20" id="name" />
</p>
<p>
<label for="email">Email :</label>
<input name="email" type="text" size="20" id="email" />
</p>
<p>
<label for="dropdown">Select :</label>
<select name="dropdown">
<option value="1" selected="selected">Option 1</option>
<option value="2">Option 2</option>
</select></p>
<p>
<label for="submit">Press to submit :</label>
<input type="submit" name="SUBMIT" value="Submit" class="btn" id="submit" />
</p>
</form>
Nice and accessible too :)