css - PhotoshopのJustify-Allと同等のCSS

Question

h2要素を取得し、そのテキストをdivの幅全体に広げたいと思います。

text-align:justify;

テキストの幅がコンテナの幅よりも大きい場合にのみテキストを広げます...Photoshopのjustify-leftのようなものです

score 12 · Accepted Answer

CSS：

h2 {text-align: justify;}
h2 span {width: 100%; display: inline-block;}

HTML：

<h2>This is a h2 heading<span></span></h2>

これにより、目に見えない余分な線が追加され、高さが高くなりすぎることに注意してください。あなたはそれを補うことを望むかもしれません：

h2 {text-align: justify; height: 1.15em;}

また、IE7以下以外のブラウザーでのみ機能する、非常に優れたマークアップの場合は、::afterセレクターを使用できます。

h2::after {
    width: 100%;
    display: inline-block;
    content: ".";
    visibility: hidden;
}

score 5 · Accepted Answer

CSS3テキストモジュールが推奨される場合のタイムマシンの回答：

text-align: justify;
text-align-last: justify;

ただし、それまではあまり役に立ちません。

2 に答える 2