html - コンテナ内で文字を重ねたり、文字を中央に配置したりしますか?

Question

リンク内である文字を別の文字の上に表示し、それらを中央に配置する必要があります。私は postion: relative と absolute を試しましたが、文字を中央に配置することは不可能です。

何か案は？私はそれらが正確に互いに重なり合うことを望んでいます、理由を聞かないでください:)

コードは次のとおりです。

<a href="#">
    <span>O</span>
    <span>B</span>
</a>

私が知っているのは親リンクの幅だけですが、特定の文字の幅はわかりません。

幅を再生するコードは次のとおりです。

http://jsfiddle.net/ZYhzJ/

編集

これはどのように見えるべきかの例です (中央に配置されておらず、これらのスパンの幅がわからない場合は負のマージンを使用できません):

http://jsfiddle.net/ZYhzJ/2/

Answer 1

http://jsfiddle.net/d7Qhq/1/

a {
    text-align: center;
    display: block;
    background-color: red;
    line-height: 50px;
    width: 50px;
    height: 50px;
    border-radius: 100px;

    position: relative;
}

a span {
    position: absolute;
    display: block;
    line-height: 50px;
    width: 50px;
    height: 50px;
}

そんな感じ？

Answer 2

http://jsfiddle.net/ZYhzJ/1/

文字を配置するための高さ (および行の高さ = 高さの半分) とパディングを調整します。