CODEWITHSUNDEEP
csscharacterfixed-width
o0'.
o0'.

Reputation: 11863

How can I force fixed character width with CSS for ANY glyph, including arcane Unicode?

I suspect that this can't be done, but I'm asking just to be sure.

I'd like to force a single character in a <span> to have a specific width and height: 1em.

Ideally the character would be stretched to 1em if it is not already fixed-width.

This must support any character, including rare Unicode glyphs, so I cannot just set the font to Courier.

Finally, this should be accomplished with only CSS, and be simple and lightweight. E.g. a complex solution which includes a div within a table containing a one-pixel image (just to display this single character) is not OK.

I can't remember any property which does this, and attempts to Google have just returned a lot of "fixed width layouts" and nothing about single characters.

If there is no simple solution, but there is a complex one, I won't use it, but I'd be curious to hear it anyway.

Upvotes: 5

Views: 2046

Answers (2)

Pops
Pops

Reputation: 30858

While I like Yi Jiang's answer, I think you might be better served by GNU Unifont based on the short discussion at this page and Wikipedia's list of typefaces with good Unicode support. Notably, that first page points out that DejaVu Sans Mono misses some glyphs which, depending on your application, may be fairly common.

Upvotes: 3

Yi Jiang
Yi Jiang

Reputation: 50135

You can use @font-face to include a fixed width font with good unicode support. The DejaVu family has excellent unicode support and a mono variant, and should do this nicely. You can use FontSquirrel's @font-face generator to create the files you need for this.

Upvotes: 5

Related Questions