Internet Explorer中的按钮上出现奇怪的白线

Question

我有一个严重的HTML问题：Internet Explorer中的按钮上会出现一条奇怪的白线。

原创样机示例 -

按钮HTML -

<input type="button" Class="buttonAll" value="Regenerate" onClick="Captcha();"/>

<input type="submit" value="Save" onclick="" class="buttonAll">

我的用户界面HTML不包含任何 Doctype ，我有一个标准只能做化妆品更改。

我尝试以两种方式应用CSS：

使用BG Image -

以上的CSS：

background:#92110d url(../images/bg-all-buttons.gif) repeat-x 0 0;

使用CSS Gradient -

CSS：

input[type="button"], input[type="submit"], .buttonAll {

    overflow:visible; display:inline-block; cursor:pointer;  
    outline:0px none; width: auto; vertical-align:middle;
    margin:3px 6px 3px 0px; padding:2px 6px; border:1px solid #804240; 

    /*background:#92110d url(../images/bg-all-buttons.gif) repeat-x 0 0;*/

    background: #92110d;    background-repeat:repeat;
    background: -webkit-gradient(linear, left top, left bottom, from(#f04b47), to(#92110d));
    background: -moz-linear-gradient(center top, #f04b47, #92110d);
    filter:  progid:DXImageTransform.Microsoft.gradient(startColorstr='#f04b47', endColorstr='#92110d');

    text-align:center; text-transform:capitalize; color:#fdfad9; font-size:11px!important; }

以上两个代码都适用于FF和Chrome。

是否有可能由于事件聚焦/活动/模糊而发生 我想知道如何删除这条白线？

Answer 1

您需要从输入字段中删除边框，例如input[type="button"], input[type="submit"], .buttonAll { border:none;}

Answer 2

Vipul上面的代码是对的。原因是你的doctype声明。因为有两种类型的文件模式1.严格模式，2。怪癖模式。 Quirk模式不支持W3C现代标准。