用字体表面绘制图标和：在内容之前

Question

使用font-face创建图标时遇到一些问题：在伪类之前。我也在使用LESS。现在，我有类似

的东西

@font-face {
    font-family: 'myfontname';
    src: url('../myurl.eot');
    src: url('../myurl?#iefix') format('embedded-opentype'),
         url('../myurl.woff') format('woff'),
         url('../myurl.ttf') format('truetype'),
         url('../myurl.svg#name') format('svg');
    font-weight: normal;
    font-style: normal;
}

.icon{
    font-family: 'myfontname';
    font-size: 1em;
    padding:0;
    margin:0;
}

.icon-correct:before{
        .icon; /*mixin*/
        position: relative;
        content:"\004C"; /*L in my font*/
        display: block;
}

在我的HTML中

<span class="icon-correct"></span>

我无法通过这种方式看到我的图标。但是，如果我做了像

这样的事情，它就有效

<span class="icon">L</span>

我做错了什么？谢谢。