高さではなく幅で動作するJQueryプラグイン

Question

;(function($) { 
      $.fn.textfill = function(options) { 
       var fontSize = options.maxFontPixels; 
       var ourText = $('span:visible:first', this); 
       var maxHeight = $(this).height(); 
       var maxWidth = $(this).width(); 
       var textHeight; 
       var textWidth; 
       do { 
        ourText.css('font-size', fontSize); 
        textHeight = ourText.height(); 
        textWidth = ourText.width(); 
        fontSize = fontSize - 1; 
       } while ((textHeight > maxHeight || textWidth > maxWidth) && fontSize > 3); 
       return this; 
      } 
     })(jQuery); 

これは私が使用しているプラ​​グインです。要素上でそれを呼び出すと、フォントサイズが小さくなり、divの幅で1行に収まるようになりますが、テキストを2行目に移動させて高さに合わせることはできません。幅と高さの両方が定義されているので、警告して見ましたので、それは問題ではありません。

何が間違っている可能性がありますか？

Answer 1

ほとんどのブラウザでは、スパンの幅や高さがありません。それはあなたの特定のブラウザがうまくいて、あなたが高さを指定できるようにするだけです。

変更のdivにスパンと期待どおりに振る舞うべき...

それとも実際に、あなたはスパン

の次元を指定できなければならないブロック要素

style="display:block;" 

にスパンを変更