なぜ過去20年以上これがなかったのか
“テキストの上下のスペースとは？ このスペースはテキストにline-heightプロパティを設定した際、フォントサイズよりも行全体の高さが大きくなる場合に生まれるスペース、「ハーフ・レディング」とも呼ばれる”
テキストの垂直方向の余白を制御できるtext-box, text-box-trim, text-box-edgeの使い方をまとめました
CSSってもはやカオス
“テキストが1行であればline-height: 1に設定して差分の余白を発生させないよう調整していた、という場合もあるかと思います”
“※ただし、フォントによります。” そっかー フォントによっちゃうのかー うーむ。
テキスト見ながら調整したい要素が増えてきたな
主要ブラウザが対応して普通に使えるようになったのか。
id:pixmap フォントやレンダリングエンジン周りがかなりカオスな状況(恐らく末端PGの9割以上は仕様を理解しきれてない)で、過去のフォントが捨て辛いので仕方ない。
やっとかー。これでようやく行送り（行間）調整がすっきりすんなあ。まあそのせいで位置設定がバラバラなフォントの負の遺産がごってりとあるから、いよいよWebフォントベースでやらんとよなあ。
これ画期的やん！しかしフォントによってどうなるかが未知数やな...
行頭にアイコンフォント置いてる時とかはまた別途検証しないとアカン。
スペース padding margin css text-box-trim
素晴らしい、やっとかゆいところに手が届いた
もはやNoto Sans JPのための機能といっても過言ではない。各フォント見比べてもNoto Sans JPが一際おかしい。
アルファベット圏の人々の上下余白のクソ細かいこだわりはすげーなと思う。そのこだわりの一割でも良いから縦書きとかルビに振り分けられないものか。
私的環境で使った感は取り敢えず良い感じ、やっとこの手の再現に頭抱えなくって良くなるんだ。webkit一強時代とは言え対応状況的に実戦はまだ無理だが・・・
行間調整しやすくなりそう。
万能ではないっぽい。FFは未対応、書体によっても変わるっぽい
角丸矩形とテキストのバランスほんとに最悪だったので改善するのすごい
CSSでテキストの上下余白が調整可能に！text-box-trimの使い方 - ICS MEDIA
なぜ過去20年以上これがなかったのか
“テキストの上下のスペースとは？ このスペースはテキストにline-heightプロパティを設定した際、フォントサイズよりも行全体の高さが大きくなる場合に生まれるスペース、「ハーフ・レディング」とも呼ばれる”
テキストの垂直方向の余白を制御できるtext-box, text-box-trim, text-box-edgeの使い方をまとめました
CSSってもはやカオス
“テキストが1行であればline-height: 1に設定して差分の余白を発生させないよう調整していた、という場合もあるかと思います”
“※ただし、フォントによります。” そっかー フォントによっちゃうのかー うーむ。
テキスト見ながら調整したい要素が増えてきたな
主要ブラウザが対応して普通に使えるようになったのか。
id:pixmap フォントやレンダリングエンジン周りがかなりカオスな状況(恐らく末端PGの9割以上は仕様を理解しきれてない)で、過去のフォントが捨て辛いので仕方ない。
やっとかー。これでようやく行送り（行間）調整がすっきりすんなあ。まあそのせいで位置設定がバラバラなフォントの負の遺産がごってりとあるから、いよいよWebフォントベースでやらんとよなあ。
これ画期的やん！しかしフォントによってどうなるかが未知数やな...
行頭にアイコンフォント置いてる時とかはまた別途検証しないとアカン。
スペース padding margin css text-box-trim
素晴らしい、やっとかゆいところに手が届いた
もはやNoto Sans JPのための機能といっても過言ではない。各フォント見比べてもNoto Sans JPが一際おかしい。
アルファベット圏の人々の上下余白のクソ細かいこだわりはすげーなと思う。そのこだわりの一割でも良いから縦書きとかルビに振り分けられないものか。
私的環境で使った感は取り敢えず良い感じ、やっとこの手の再現に頭抱えなくって良くなるんだ。webkit一強時代とは言え対応状況的に実戦はまだ無理だが・・・
行間調整しやすくなりそう。
万能ではないっぽい。FFは未対応、書体によっても変わるっぽい
角丸矩形とテキストのバランスほんとに最悪だったので改善するのすごい