ボックス幅いっぱいの両端揃えについて、ご質問します。

質問

ボックス幅いっぱいの両端揃えについて、ご質問します。

cssの「両端揃え」の、

　text-align: justify;
　text-justify: inter-ideograph;

などは、複数行に渡る文章についてのようですが、
単独行で、そのボックスいっぱいの両端揃えはできないでしょうか？

具体的には、表のセル内において、

　名　　　前

　出　身　地

　好きな歌手

（すみませんが、等幅フォントを想定して見てください）
のような、自動で字間が調整されて左右が両方とも揃っているレイアウトです。

現状、letter-spacingでやっていますが、
文字数ごとに調整の必要があるほか、
ブラウザの違いによって、収まらず改行されて

　名
　前

のようなレイアウト崩れが起こってしまいます。

いろいろ調べてもわかりませんでした。
ご回答いただけますよう、よろしくお願いします。

回答No.1

naokita · ベストアンサー

justifyは英文仕様なので、
日本語での全ブラウザ対応を期待するのはキビしいでしょう。
-----------------
マークアップを無視して良いなら、
そのセルにテーブルを作って
テーブル100%、text-align設定で、セルに１文字毎に入れるか、
<table class="aa"><tr>
<td>出</td><td class="td2">身</td><td class="td3">地</td>
</tr></table>

table.aa{ width:100%;}
.aa .td2{text-align:center;} .aa .td3{text-align:right;}

-----------------
または、テーブルを使わず、１文字毎のセレクタで
<span>出</span><span>身</span><span>地</span>
block,float,width:%; text-align などで対応。
positionでも出来るし、他にも考えれば色々と。

お礼

ご回答ありがとうございます。
いろいろな方法がありますね。

ただやはり、統一的にスッキリと解決するコードはないのですね。
他の方の回答もないようですので、締め切りとさせていただきます。
ありがとうございました。