View Single Post
Old 11-28-2010, 12:40 AM   #7
jgray
Fanatic
jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.jgray ought to be getting tired of karma fortunes by now.
 
Posts: 554
Karma: 2928497
Join Date: Mar 2008
Device: Clara 2E & Sage
Attached is an HTML/CSS sample, using your picture for the text. I was too lazy do do the accented characters. This method works until you either exceed the line length of the reading device (word wrap doesn't work), or you use a font size that also forces things off screen.

I used two different methods to bold text. Use whichever one you like. Since I was using a class for underlining the column headings, it just made sense to do the same for bold in those span tags. I used ems, but you may want to see if another unit of measure works better under varying font and screen sizes.

I didn't try this code on my Sony reader, but see no reason it wouldn't work, provided you use a small enough font to fit the screen. The previously mentioned method of setting "margin-left" on the spans would work better for line wrapping, but things wouldn't line up as well. If anyone can think of an alternate method that handles large fonts and word wrap, please post. I suspect that getting columns to line up regardless of font size will not be possible.

Joe
Attached Files
File Type: zip Vocab.zip (1.1 KB, 251 views)
jgray is offline   Reply With Quote