I want to know exact length in pixels of String i.e. "Hello World".
It should not be length of my container.
Any Help???
-
1"It should not be length of my container." Pick the right container (e.g., a span with no padding) and there's no difference.T.J. Crowder– T.J. Crowder2013-02-13 11:53:13 +00:00Commented Feb 13, 2013 at 11:53
Add a comment
|
3 Answers
Put your text in a <span> and use JavaScript to measure the width of your <span>.
HTML:
<span id="text">Dummy text</span>
JavaScript:
var textWidth = document.getElementById("text").clientWidth;
jQuery:
$('#text').width();
3 Comments
Andry
This does not work if the
span has a CSS style which sets its width to 100% for example!
Mike
You're right @Andry. Except
span is per definition an inline element. This means that you cannot define its width without changing its display to e.g. block or inline-block.
Elnur Shabanov
Also, another good answer mentioned here: stackoverflow.com/a/32558114/5864984.
You can create some inline element (span, for example), set your string as element's content (innerHTML), insert it into document (append to some element) and get it's width (clientWidth).
There is no other way to measure length of string in pixels because it depends on font style.
Comments
Since the pixel length of the string will change depending on independently applied CSS attributes such as font and weight and size, I can't see this being possible in JS.
