Stretching text horizontally using CSS
Yes - you can achieve this by using CSS 2D transforms.
Here's a working JSFiddle.
Note that the example in the Fiddle/code below is for Chrome/Safari (WebKit), however, you can use 2D transforms in all major browsers by using the -moz-
, -o-
, and ms
equivalent prefixes/methods!
HTML:
<span>Hello!</span>
CSS:
span {
transform:scale(3,1);
-webkit-transform:scale(3,1);
display:inline-block;
}
Support:
It is supported in Chrome, Firefox, IE9+ and Opera browsers.