Basicaly I took the form posted in "Optical Contact / Request Information form by laurel" and altered it to suite my needs and added some CSS styling. Hope you guys like it and can find a use for it somewhere.
- Code: Select all
<style type="text/css">
<!--
legend
{
color:#000000;
background:#6699FF;
border: 1px solid #781351;
padding: 2px 6px;
}
fieldset
{
border: 1px solid #781351;
width: 90%;
background-color:#E9FEFE
}
label2
{
width: 16em;
text-align: right;
margin-right: 0.5em;
display: block;
}
label1
{
width: 8em;
float: left;
text-align: right;
margin-right: 0.5em;
display: block;
}
select {
width: 8em;
text-align: left;
}
input
{
color: #781351;
background: #fee3ad;
border: 1px solid #781351;
}
.submit input
{
color: #000;
background: #ffa20f;
border: 2px outset #d7b9c9;
}
-->
</style>
</head>
<body>
<fieldset>
<legend>JLS Design Details</legend><br/>
<label2 for="contact">Contact: **************</label2><br/>
<label2 for="tel">Telephone: **************</label2><br/>
<label2 for="mob">Mobile: **************</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Your Details</strong></legend>
<p><label1 for="name">Your Name:</label1><input type="text" name="name" size="40"></p>
<p><label1 for="email">E-mail:</label1><input name="email" type="text" size="40">
<p><label1 for="dayphone">Day Phone:</label1><input type="text" name="day_phone" size="20"> </p>
<p><label1 for="evephone">Evening Phone:</label1><input type="text" name="night_phone" size="20"></p>
</p>
</fieldset><br />
<fieldset>
<legend><strong>When would you like this project to begin?</strong></legend>
<br/>
<label2 for="month"><strong>Month</strong>
<select NAME="month" id="ff_elem203" size="1">
<option SELECTED VALUE="none">Select Month</option>
<option VALUE="Jan">Jan</option>
<option VALUE="Feb">Feb</option>
<option VALUE="Mar">Mar</option>
<option VALUE="Apr">Apr</option>
<option VALUE="May">May</option>
<option VALUE="Jun">Jun</option>
<option VALUE="Jul">Jul</option>
<option VALUE="Aug">Aug</option>
<option VALUE="Sep">Sep</option>
<option VALUE="Oct">Oct</option>
<option VALUE="Nov">Nov</option>
<option VALUE="Dec">Dec</option>
</select></p></label2>
<br/>
<label2 for="year"><strong>Year</strong>
<select name="select" id="year" size="1">
<option value="2007" selected="selected">2007</option>
<option value="2008">2008</option>
<option value="2009">2009</option>
</select>
</label2>
</fieldset><br/>
<fieldset>
<legend><strong>Your Enquiry is about:</strong></legend>
<div align="left">
<table border="0" width="90%" id="table4" align="left">
<tr>
<td width="150">
<p><input TYPE="checkbox" NAME="ff_nm_Website[]" VALUE="info" id="ff_elem193">
<label id="ff_lbl193" for="ff_elem193">Website Design </label>
</p>
<p><input TYPE="checkbox" NAME="ff_nm_NewMedia[]" VALUE="info" id="ff_elem194">
<label id="ff_lbl194" for="ff_elem194">New Media </label>
Design</td>
<td width="164">
<p><input TYPE="checkbox" NAME="ff_nm_SoftwareBox[]" VALUE="info" id="ff_elem195">
<label id="ff_lbl195" for="ff_elem195">SoftwareBox</label>
Design</p>
<p><input TYPE="checkbox" NAME="ff_nm_Print[]" VALUE="info" id="ff_elem196">
<label id="ff_lbl196" for="ff_elem196">Print Design (eg Poster)</label>
</td>
<td width="304">
<p><input TYPE="checkbox" NAME="ff_nm_Logo[]" VALUE="info" id="ff_elem197">
<label id="ff_lbl197" for="ff_elem197">Logo</label>
Design</p>
<input TYPE="checkbox" NAME="ff_nm_Other[]1" VALUE="info" id="ff_elem199">
<label id="ff_lbl199" for="ff_elem199">Other Information or Questions: </label>
<p></td>
</tr>
</table>
</div>
<p></p>
<p><textarea COLS="50" NAME="other_info" id="ff_elem192" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset>
<legend><strong>The best way to contact you is</strong></legend>
<input type="checkbox" name="contact" value="phone"> By Telephone
<input type="checkbox" name="contact" value="email"> By Email </p>
</fieldset><br/>
<fieldset>
<legend><strong>Use the space below for additional questions & comments:</strong></legend>
<p><textarea COLS="50" NAME="other_info0" id="ff_elem205" style="height: 63; width: 612" rows="4"></textarea>
</p>
</fieldset><br/>
<fieldset><legend><strong>AntiSpam</strong></legend>
<div align="center">{imageverification}</div>
</fieldset>
</p>
<p align="center">
<input type="submit" value="Send to JLS Design" name="Submit" style="font-weight: bold">
<input type="reset" value="Reset (cancel form)" name="reset" style="font-size: 8pt">
</p>
Example of what this form looks like:
Hope it is ok.
Post edited by: jamesls, at: 2007/09/27 04:15<br><br>Post edited by: jamesls, at: 2007/09/27 04:16
