純粋なcssのクローズボタン

質問

JSFiddle

純粋なCSSでそのリンクのXのようなものを作る方法はありますか？

どのように解決するのですか？

必要以上に時間をかけてしまったので、明らかな理由で IE でのテストはしていません。とはいえ、ほとんど同じです。

http://jsfiddle.net/adzFe/14/

a.boxclose{
    float:right;
    margin-top:-30px;
    margin-right:-30px;
    cursor:pointer;
    color: #fff;
    border: 1px solid #AEAEAE;
    border-radius: 30px;
    background: #605F61;
    font-size: 31px;
    font-weight: bold;
    display: inline-block;
    line-height: 0px;
    padding: 11px 3px;       
}

.boxclose:before {
    content: "×";
}