css - 开引号在 Firefox 18 中使用 :before and content 定位不正确

Question

我正在使用 :before 插入 content 元素 open-quote。

CSS 代码:

blockquote {
    background:#f9f9f9;
    color: #555;
    font-style: italic;
    text-align: center; 
    border: 1px solid #ccc;
    border-left:5px solid #ccc;
    margin:0 30px;
    padding: 30px;
    border-radius: 5px;
    box-shadow: inset 0 2px 0 rgba(200, 200, 200, 0.7),-5px -4px 25px rgba(0, 0, 0, 0.3);
}
blockquote:before {
    color:#ccc;
    content:open-quote;
    font-size:4em;
    float:left;
    margin-top:-30px;
    text-shadow: 0 1px 1px #909090;
}

对于 Chrome 和 IE9，它似乎可以正常工作。

我猜 margin-top:-30px; 会被 Firefox 以不同的方式解释。

我该如何解决这个问题？谢谢!

Answer 1

好的，我可以通过使用 css 浏览器 hack 来解决这个问题:

@-moz-document url-prefix() { 
    blockquote:before {
        margin-top:0;
    }
}

但我很乐意得到更好的解决方案。