In my website I have a fixed-size rectangle with header. Normally text size is quite big. However, if text is too long it will be truncated. But I'd rather font shrink automatically, like font-size: size-to-fit
. Is it possible in CSS without JS?
Asked
Active
Viewed 1,345 times
1

user986654
- 215
- 3
- 9
-
No, but you could use an SVG image set to `width: 100%`. – Joey Nov 02 '11 at 13:06
-
1No it's not possbile without javascript and I wouldn't recommend an SVG file because you said you were using it in the header so I am guessing that it is a key word for SEO as well. – CBRRacer Nov 02 '11 at 13:12
-
That's not possible just using CSS, you'd need some JS (like [this jQuery plugin](http://plugins.jquery.com/project/TextFill)) to achieve it. – scumah Nov 02 '11 at 13:13
-
1CBRRacer, SVG retains text and is therefore visible to search engines. You know I had a reason for recommending SVG. – Joey Nov 02 '11 at 13:17
-
@Joey I new it was text based but I thought the text was different than the render hence causing the hidden text black mark, but after a few quick searches I see the light 8-) – CBRRacer Nov 02 '11 at 13:23