I have a DIV which is 100px in width, in each row, now I want to fill exactly 10 characters, what is the font-size I should use?
Share
Sign Up to our social questions and Answers Engine to ask questions, answer people’s questions, and connect with other people.
Login to our social questions & Answers Engine to ask questions answer people’s questions & connect with other people.
Lost your password? Please enter your email address. You will receive a link and will create a new password via email.
Please briefly explain why you feel this question should be reported.
Please briefly explain why you feel this answer should be reported.
Please briefly explain why you feel this user should be reported.
I have a DIV which is 100px in width, in each row, now I want to fill exactly 10 characters, what is the font-size I should use?
As the comments to your question suggest, this is a bit messy to accomplish in a good way, since it vary between different fonts, OS, browser etc. However, one thing you could try to experiment with at least is putting the CSS-attribute
text-align: justify;on your div.If you put a space between each character, and choose the largest font-size where 10 characters fit on a single row. Then this CSS-attribute will make sure that the spacing between the characters are adjusted so that the characters fill out the entire div.
This is not a bullet-proof way of doing this, and it will probably still be broken for some users, but if you experiment with different browsers to find a suitable size, and have a bit of margin so that you don’t necessarily choose the absolutely largest size that fits, then the adjusted spacing hopefully will take care of most variations between browsers, OS etc. Those who use increased font-size will however still have a problem.