Image Padding in IE vs. FF

[ortem]

Hello folks...

I have heard great things about this site and I seek some assitance.

I have an image and then beneath that I have a form field for an email list... in IE the natural padding at the bottom of the image is huge! in FF there is none. This makes it painful to look at in IE (I am being dramtic but you know what I mean!).

How would I tame the padding in IE?

Thank you...

[collymellon]

Hi Ortem,

Clear the margins and padding on your img >

IMG{
margin: 0 auto;
padding: 0 auto;
}

Hope this helps - if not could you post some code for me to have a look at.

CM

[ortem]

Hiya CollyMellon,

Thanks for the help. I tried clearing the padding yet that did not work. Here is the CSS code for the image and the form right below it :

img.logo{
margin: 0;
padding: 0;
}

form {
padding: 0;
}

input {
background-color: #000000;
font-family: Verdana;
font-size: 12px;
font-style: normal;
color: #ffffff;
border: 1px solid #ffffff;
padding: 0;}

button {
background-color: #000000;
font-family: Verdana;
font-size: 10px;
font-style: normal;
color: #ffffff;
border: 1px solid #ffffff;
padding: 0;}


What do you think?

[SuzyUK]

it could be the default margin on the form?

try:
form {
padding: 0;
margin: 0;
}

Suzy

[zackattack]

Greetings

Sounds more like it could be to do with the form element. There is one possible answer below, but without seeing the code not sure if your form is set up this way or not..

Are you using?

<form>
<fieldset>
<legend>Title</legend>
form elements here.....
</fieldset>
</form>

IE does not treat padding correctly on the <fieldset> tag when you use <legend> and you will find you get extra space above form elments in IE when you apply padding-top to the fieldset item in CSS

IF you are using this method to construct your forms, try
fieldset {
padding: 0;
}

If you really need this padding in FF but NOT IE you can deliver one value to IE and another to FF using a simple hack

/* ie does not recognise this declaration */
html>body fieldset {
padding-top: 10px;
}

Let us know how it goes

ZA

[ortem]

Heya Suzy!

You were right on the mark of a small thing I should have noted and will remember to do so in the future.

Thank you for your help and thank you to everyone for the input!