Hello,
This page in IE7 creates dark borders around the form and heavy lines for the input parts too. I'm attaching a PDF.
This is the HTML for the form
<form action="contactform.php" form id="ContactFrm" name="form1" enctype="application/x-www-form-urlencoded" method="post" onSubmit="return validateThis(this)" >
<fieldset>
<legend>
<label for="Company_Organization">Company or Organization:<br />
</label>
<input type="text" name="Company_Organization" id="CompanyorOrganization" tabindex="10" />
</legend>
<p>
<label for="Name">Contact Name:<br />
</label>
<input type="text" name="Name" id="Name" tabindex="20" />
</p>
<p>
<label for="Phone">Phone Number:<br />
</label>
<input type="text" name="Phone" id="Phone" tabindex="30" />
</p>
<p>
<label for="Email">Email Address:<br />
</label>
<input type="text" name="Email" id="Email" tabindex="40" />
</p>
<p>
<label for="CommentsQuestions">Comments? Questions?<br />
</label>
<textarea name="CommentsQuestions" id="CommentsQuestions" cols="45" rows="5" tabindex="50"></textarea>
</p>
<p>
<input type="submit" name="submit" id="Send" value="Send" tabindex="260" />
</p>
</fieldset>
</form>
And the CSS
/*Contact Us Form*/
input#Send {font-family:Palatino, Georgia, "Book Antiqua", serif;
color:#663333;
background-color:#FFF;
height: 30px;
width: 100px;
border-width:thin;
}
input#CompanyorOrganization {
border-width:thin;
border-color:#663333;
width:400px;
}
input#Name {
border-width:thin;
border-color:#663333;
width:400px;
}
input#Phone {
border-width:thin;
border-color:#663333;
width:400px;
}
input#Email {border-width: thin;
border-color:#663333;
width:400px;
}
form#ContactFrm {margin-left: 50px;
}
form#ContactFrm fieldset {border: 1px;
border-color:#663333;
}
form#ContactFrm fieldset label {line-height:2.75em;
font-size: .95em;
}
form#ContactFrm fieldset p {line-height:2.75em;
font-size: .95em;
}
input {width:210px;
height: 20px;
}
textarea#CommentsQuestions {
width:400px;
height:100px;
border-color:#663333;
border-width:thin;
}
I've started a separate CSS file to specifically target this issue:
/*Contact page_form*/
form#ContactFrm {border-color: transparent;
}
What am I missing? How do I get rid of the dark border around the form? And create a lighter border around the inputs?
Thanks!
