How to re-size text to fill a fixed size HTML container?

I have to show a variable length text in a fixed size div. How can I achieve this?


  • unblockableunblockable Nigeria
    edited March 2014

    This code works, but I am using a
    little jQuery, I hope this helps in
    some way...

    <style type="text/css">
        #container {
            font-family:Myriad Pro;
    <div id="container">01234567890123456789</div>
    <script type="text/javascript">
            var w = parseInt($("#container").width());
            var l = parseInt($("#container").html().length);
            var fontSize = ( (w / l) *2 ) - 2;
            fontSize = fontSize+'px';
            $("#container").css('font-size', fontSize);
Sign In or Register to comment.

Howdy, Stranger!

It looks like you're new here. If you want to get involved, click one of these buttons!


In this Discussion