无法为输入表单应用框阴影插入

Question

我希望我的输入表单有插入阴影，但它不起作用。这是我的代码

 #searchopt div input[type='text'],#searchopt div select{
width:220px;height:30px;padding:6px;
/* Overall Layout: box shadow insect*/

-webkit-box-shadow: inset 10px 3px 296px -172px rgba(51,39,51,1);

-moz-box-shadow: inset 10px 3px 296px -172px rgba(51,39,51,1);

box-shadow: inset 10px 3px 296px -172px rgba(51,39,51,1);

}

然而，我的整体包装div我也使用阴影但外面的阴影，它工作正常。这是

/* Overall Layout*/
#wrapper{
margin:0px auto;
border:.5px solid #CCC;
width:1028px;
height:1028px;
overflow:hidden;
font-family: Arial,"Helvetica Neue",Helvetica,sans-serif;
/* Overall Layout: box shadow*/
-webkit-box-shadow: 0px 1px 8px 0px rgba(50, 50, 50, 0.69);
-moz-box-shadow:    0px 1px 8px 0px rgba(50, 50, 50, 0.69);
box-shadow:         0px 1px 8px 0px rgba(50, 50, 50, 0.69);
}

任何人都可以帮助我吗？谢谢

Answer 1

将border: none;添加到输入CSS。这样输入就不会使用默认的，浏览器特定的输入样式和box-shadow应该工作

[编辑]这是一个小提琴：http://jsfiddle.net/AR6m8/。我不得不使用自定义阴影值来查看它是否有效，因此您的问题可能与阴影值有关。