Question

I'd like to fit a block of text into a div by changing the font size automatically.

I've been using this jQuery function,

$(function() {
    while( $('#fitin div').height() > $('#fitin').height() ) {
        $('#fitin div').css('font-size', (parseInt($('#fitin div').css('font-size')) - 1) + "px" );
    }
});

and it works well--except that the accuracy isn't high enough (it lowers the size by 1px every time; I need it to work with much smaller increments, such as .1mm). Am I missing something here?

Thanks--let me know if I haven't included enough info.

Was it helpful?

Solution

From Pixel on Wikipedia,

In digital imaging, a pixel, pel, or picture element is a physical point in a raster image, or the smallest addressable element in an all points addressable display device; so it is the smallest controllable element of a picture represented on the screen.

Then, you can't have more precision than a pixel.

OTHER TIPS

You might want to check out FitText. Have been using it for a while now and love it. Should solve the problem you are having.

OK, so after days of trying, I've learned:

There is no way to change the font of a paragraph in a smaller increment than 1px PER LINE! Therefore there is no way to change the size of 40 lines, for example, in a smaller increment than 40px. Which is a problem. The only way I was able to do it, in the end, was by creating an image file of the block of text. Very annoying, if you want to change it at all, but it appears this is the only way possible.

Licensed under: CC-BY-SA with attribution
Not affiliated with StackOverflow
scroll top