Posted on April - 26 - 2011
IE visibility: hidden or display: none problem for submit button and an wise solution
I was creating a quick login form to place on the top left of a website I was building. The space was tiny for the form. And it was looking ugly with the submit button. So as I knew the enter button can submit a form, I left out the submit button. But without the submit button form couldn’t get submitted by pressing enter key!
Then I made a button like this:
<input type=’submit’ name=’submit’ style=’display:none’>
It didn’t work in IE7! I tried
<span style=’display:none’ >
<input type=’submit’ name=’submit’ >
</span>
then. It didn’t work either. I tried with CSS “visibility: hidden”, didn’t work either! I don’t know why microsoft did put this extra effort to cancel the default operation of the submit button if that’s not shown. I searched through internet, found a lot of keypress tracking thing with javascript solutions. But that’s not my way. So I made a cleaner solution:
<input type=’submit’ name=’submit’ style=’width:0px’>
LoL…there is always a backdoor
. Elegant, huh! Not yet…it has some positional problem! Here goes the fix:
<input type=’submit’ name=’submit’ style=’width:0px;height:0px; margin:0px; border:0px; background:green;position:absolute;top:-10px’>


















