Forms - browers differences

Question

Hi folks
I've built a form using CCS in DW8 - with the usual: name,
email, comments box with a tick box. The form appears on a pink
background. I have created #Divs as well as .classes for the
elements. I have a problem though - on the 'checkbox' when I view
the page in FIrefox, Safari, Camino & Mozilla the page looks
fine - however on the IE browser the checkbox has a box/outline
around it (which it shouldn't have) it's only a slight glitch
however it shouldn't be there. I've even wrote a class for the
checkbox with a pink outline/border to see if that would sort the
problem - but it doesn't!
Any ideas, work throughs? Have others come across this
problem?
Many thanks in advance

Answer 1

Hi there,
here's the URL - remember to view in IE as that's what's
causing the problem:
http://www.vipink.co.uk/contact/contactVIP.php
Here's the relevant code / CSS for the checkbox:
<div id="mailing_list">
<label for="mailing">Add me to your mailing
list</label>
<input name="mailing" type="checkbox" class="checkbox"
id="mailing" value="true" />
</div>
CSS:
/* Form Styling */
/* Label styling */
label {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
color: #FFCCFF;
font-weight: normal;
text-decoration: none;
padding: 2px;
/* Text space styling */
#Content #Container #IUK_Form #Name {
margin-top: 10px;
/* Submit button styling */
.SubmitBtn {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: normal;
background-color: #EC2D75;
padding: 10px;
border: 1px solid #FFFFFF;
color: #FFFFFF;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 15px;
/* Tick box styling*/
.checkbox {
background-color: #F55296;
margin: 0px;
padding: 0px;