JSFiddle - React, Tailwind, and code Playground

HTML

<div><p>Maria Alejandra</p></div>

CSS

div{
    background: none repeat scroll 0 0 #999999;
    border: 1px solid #639BBE;
    height: 47px;
    margin-top: 13px;
    padding: 0;
    width: 153px;
    font-size: 40px;
    text-align: center;
}

JavaScript

var size = 40;
while($('p').width() > $('div').width() || $('p').height() > $('div').height()){
    size--;
    $('div').css('font-size', size+'px');
   	$('div').css('height', '').delay(10);
}