The readonly TextMetrics
.width
property contains the text's advance width (the width of that inline box) in CSS pixels.
Syntax
readonly metrics.width;
Examples
Given this <canvas>
element:
<canvas id="canvas"></canvas>
You can get a TextMetrics
object using the following code:
var canvas = document.getElementById("canvas"); var ctx = canvas.getContext("2d"); var text = ctx.measureText("foo"); // TextMetrics object text.width; // 16;
Specifications
Specification | Status | Comment |
---|---|---|
WHATWG HTML Living Standard The definition of 'TextMetrics.width' in that specification. |
Living Standard |
Browser compatibility
Feature | Chrome | Edge | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|---|
Basic support | 4.0 | (Yes) | 1.5 (1.8) | 9.0 | 9.0 | 3.1 |
Feature | Android | Edge | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|---|
Basic support | 2.1 | (Yes) | 1.0 (1.8) | ? | 10.0 | 3.2 |