Sorry, I'd be with those who suggest SVG, .jpg, .pdf and similar...

if I really believed that your rendering "needs to be explicitly formatted (it is a playoff bracket)..."

But I don't. This is not an application that requires the precision of a blueprint or mechanical drawing.

Given the issues with fonts, user settings, cross-browser variance (to name just a few), I'd be very surprised if you need more than thoughtful CSS (width: nn units; max-width: nn units) or well spec'ed tables (widths -- as units of whatever flavor floats your boat -- for the table and the individual TDs). Either approach should get you close enough to work for 99% of your users. IMO, you'ld be well advised to assume a screen width of NMT 800 pixels and a rendering area which allows for chrome.

At that point, you can work out roughly how many chars fit a given column(s if you're sneaky with column-spans) and turn your problem on it's head: "In order to generate the right number of characters, calculate/experiment with something like a fairly wide 12 point font size, and instead of calculating widths, decide how to truncate/abbreviate your listings.