オートラインハイトのようなものがありますか？

私は、テキストを収めるのに十分な大きさの固定されたサイズのCSSを持っています。テキストの最後とボックス境界の間に空白を入れたくありません。どのように箱に入れることができますか？ラインハイトをフィットさせるようなもの。オートラインハイトのようなものがありますか？

出典

2012-09-10 dstonek

これはパディング付きのdiv：5pxです。すべてのテキストを「拡大」して境界に5ピクセルにします。いくつかのテキストは大丈夫に適合し、他は境界線パディングに達するには2行が必要です – dstonek

ブラウザにも依存しています。 SafariはフォントをFirefoxよりも小さくしているので、いっぱいに余裕があります。（emユニットを使って） – dstonek

サーバから文字列長を取得し、それに応じて行の高さを調整することを考えます。 type 'font'iiiiii'に応じて 'aaaaaa'より少ない部屋を使うことができますが、統計的には実際のテキストに大きな違いはありません。 JSはテキストの長さを測定する仕事をしますが、私はここでそれを避けたいと思います。 – dstonek

Try vertical-align:bottom

問題が解決しない場合は、それはまだあなたがやりたいしない場合、あなたはあなたが達成しようとしているものをさらに明確にする必要がありますline-height: 1em

を試すことができます。

出典

2012-09-11 00:00:26

垂直方向の揃えは、スペースの問題を下から上に移動するだけです。私は、OPがラインの高さを自動的に調整して縦の間隔がどこにでも等しくなるようにしたいと思う。 – sachleen

また、非表のセルまたはイメージ要素で垂直方向の整列を行うには 'display：table-cell'を実行する必要があります。 – sachleen

@sachleen問題のボックスが計算された行の高さよりも小さい場合のみ。デフォルトでは、ボックスはベースラインに対して垂直方向に整列されます。これは一番下のラインより少し上です。そして 'display：table-cell'は、ボックス自体ではなく、ボックスの* contents *を垂直に整列させます。 –

-4

申し訳ありませんが、JavaScriptでのみ可能です。

出典

2012-09-11 00:22:43

いいえ、CSSで可能です... – Jon

これはJavaScriptでは不可能です –

line-height: normal;

が正しいです。

出典

2013-04-22 19:52:26 httpete

'normal'がデフォルト値ですが、これは効果がありません。 – nullability

いいえ、間違っています。 'line-height：normal;'は、周囲の要素の高さではなく、font-sizeに相対的です。さらに、 'font-size'に対する' normal'の特定の関係は、ブラウザごとに異なります。 –

オートラインハイトのようなものがありますか？

答えて

関連する問題