<input type="button" value="open this page in new window" />

修改为

<input style="overflow: visible;" type="button" value="open this page in new window" />

可以看出当文字长度很长的时候,button的长度默认被撑宽很长,当添加overflow:visible以后可以更好的贴合. 而overflow:visible的功用其实是重置了input的haslayout属性,具体情形看这里http://old9.blogsome.com/2006/04/11/onhavinglayout/ (内容最新,但被墙) , 或看这里http://www.blueidea.com/tech/site/2006/3698.asp (内容不是最新的). ie的layout属性造成了很多麻烦,以前也陆陆续续遇到了很多,不过都没记下来,以后补充. 再发一个在IE6,7,8, Firefox, Opera里显示都一致的按钮, 银白色边框,按下有按下效果.

代码是

.button {
    vertical-align: middle;
    cursor: pointer;
    width: auto;
    overflow: visible;
    font: bold 11px Arial, Helvetica, sans-serif;
    color: #F5F5F5;
    background-color: #626262;
    outline: 1px solid #626262;
    border: 1px solid #FFF !important;
    border: 3px double #626262;
    outline-bottom: 1px solid #626262;
    border-bottom: 1px solid #626262 !important;
    border-bottom: 1px solid #626262;
    padding-left: 4px;
    padding-right: 4px
}