[解決済み] オーバーフローテキストを中央揃えにすることはできますか？

質問

を指定した場合 text-align:center を指定すると、テキストは要素のコンテンツ ボックス内で中央に配置されます (予想通り)。

を指定すると text-align:center を指定すると、テキストはコンテンツ ボックスの左端に揃えられ、コンテンツ ボックスの右端からはみ出します。

この 2 つのケースを実際に見てみると はこちら .

CSSマジックでテキストをコンテンツボックスの左端と右端の両方から均等にはみ出させて、中央に表示させることはできますか？

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

私はこの質問が古いことを知っているが、私はちょうど同じ問題を持っていたし、スパンだけで、はるかに簡単な解決策を見つけました。 http://jsfiddle.net/7hy3w2jj/

<div>some text</div>
<div>
    <span class="text-overflow-center">some text that will overflow</span>
</div>

では、次の定義が必要なだけです。

.text-overflow-center {
    margin-left: -100%;
    margin-right: -100%;
    text-align: center;
}

擬似要素を扱うことができれば、htmlを全く使わないでも可能です。 テキストコンテナにこれらの定義を追加するだけです。 http://jsfiddle.net/7287L9a8/

div:before {
    content: "";
    margin-left: -100%;
}
div:after {
    content: "";
    margin-right: -100%;
}

擬似バリアントの唯一の欠点は、1 行のテキストでしか動作しないことです。