固定長のdivに収まるように任意の長さの文字列をサイズ変更する

Question

解決策を見つけることができない。私は100px幅の「ボタン」divと可変ラベルの30pxの高さを持っています。フォントサイズを縮小して、ラベルテキスト全体が常に見えるようにします。

JSまたはCSSソリューションはどちらもjqueryで動作します。

フラッシュでは、テキストの行数を調べることでこの問題を解決しました.1を超えるとフォントサイズが1行に収まるまで縮小します。それがjavascriptで可能かどうかはわかりません。

編集：その人は可変サイズのコンテナを持っていたので、異なる解決策が可能でした。

Answer 1

ここでできることの1つは、次のCSS属性でdivテキストと同様のサイズのラベルテキストを取得してからスクロール幅を数え、次にjavascriptループを作成し、fontwidthをいくつかのピクセル単位で減らしてスクロール幅がわかるまであなたの希望する幅よりも小さい。私はこれがあなたの質問に答えるん

// dummy divelement 
var divElement = document.getElementById('#myelement') 
var fontSize = 15; // Starting from 15 
while(divElement.offsetWidth < divElement.scrollWidth) { 
    divElement.style.fontSize = fontSize + "px" 
    fontSize--; 
} 

を試してみました

white-space: pre; 
overflow-x: scroll; 

小Javascriptコード？または私はあなたにすべての例を提供すべきですか？