The only thing I can think of is to put each letter in an HTML element, and style that element something along the lines of:
width: 8px; /* Whatever fixed width you want here */
display: block; /* Force the width to be respected. See also: inline-block */
float: left; /* So it won't be 1-per-line. Not needed for inline-block */
text-align: center; /* So the character appears in the middle of the block */
I'm not familiar with Flex, but if I were to implement this approach, I would put together some Javascript that would generate all the elements for me.
