Google chrome 伪元素（：after）不在FF/IE中工作，但在Chrome中工作？

请参阅此代码笔：

按钮在Chrome中工作，但在IE/FF中不工作

<input name="input_15" id="input_6_15" class="medium" tabindex="8" type="file">
#input_6_15{position:relative;}
#input_6_15:after {
content: "Upload Media";
width: 150px;
height: 20px;
background: none repeat scroll 0% 0% #626D2D;
display: block;
position: absolute;
padding: 8px 5px 10px;
color: #FFF;
visibility: visible;
top: 4px;
left: -38px;
text-transform: uppercase;
text-align: center;
line-height: 26px;
z-index: 99999999;
}

#输入_6_15{位置：相对；}
#输入_6_15:之后{
内容：“上传媒体”；
宽度：150px；
高度：20px；
背景：无重复滚动0%0%#626D2D；
显示：块；
位置：绝对位置；
填充：8px 5px 10px；
颜色：#FFF；
能见度：可见；
顶部：4px；
左：-38px；
文本转换：大写；
文本对齐：居中；
线高：26px；
z指数：9999999；
}

我发现Firefox和IE很难在输入端呈现伪元素（这里有更多信息：）

我的解决方案是使用这个：

@-moz文档url-prefix（）{//Firefox代码在这里 }

并将目标改为输入元素的container div