Reputation: 6040
I have a defined style for div
with fixed width and the text inside the div
could have different lengths, like in this example. Is there any method using CSS and/or JS to adjust the text size in such a way that it will stay in bounds of the container?
Upvotes: 0
Views: 2959
Reputation: 5640
this may work for you, try this
var originalFontSize = 12;
var divWidth = $('.cell').width();
$('.cell span').each(function(){
var spanWidth = $(this).width();
var newFontSize = (divWidth/spanWidth) * originalFontSize;
$(this).css({"font-size" : newFontSize, "line-height" : newFontSize/1.2 + "px"});
});
Upvotes: 3