IE7 stretches the form submit button

[webjoker]

The submit button on my form show up distorted in IE7, but when I look at it in FF it shows up fine. I have no style on the submit buttons. But for some reason IE7 stretches out the button image that you typically see on a form.

Does anyone have an idea why this is doing this?

Here is what my code looks like:
<FORM name="myForm" action="example.php" method=post>
Your Name :<br />
<select name="name" class="inputbox" size="1"><option value="">:: Select Below ::<option value="name1">Name1<option value="name2">Name2<option value="name3">Name3</option></select>
<br /><br />
Your Idea :<br />
<textarea name="idea" rows="5" cols="51"></textarea><br />
<INPUT type="submit" value="Please Submit Here" name="submit">&nbsp;&nbsp;<INPUT class="button" type="reset" value="Reset" name="reset">
</FORM></center>

[Setek]

You should notice this happening in IE 6 as well, it's not a pure IE 7 problem :)

It happens when you give a value for a button that tends to be longer than maybe ten characters... You should also notice if you put padding on the

input

it doesn't display the correct width of padding.

Thankfully, there's an easy fix:

overflow: visible;

When you add that CSS property value to your button, it will behave properly (and you don't need to have it in an IE-only section either, this does not affect standards-compliant browsers negatively.)

[webjoker]

Cool, thanks for the suggestion. I've been wondering what has been going on with that. I also use FF and it doesn't respond that way. Then I go and check IE and huh? why are you doing that lol.

Thanks again Setek!