Help with bitmap fonts.

edited March 2018 in Style Development Chrome
I am using Fairfax, which is a 6*12 bitmap font in TTF format (Why Chrome does not provide X fonts support?) and only looks good at that size, and I decide to use a compact layout as the screen is only 1152*864 (on a 15' CRT)
However, there are multiple problems:
1.Some sites ignore "line-height" and "font-size", like Wikipedia's title and sidebar.Reddit does this too but worse, with huge paddings in the code view.Also, I am using line breaks instead of new paragraphs in my comments, so there should be only 1 pixel between lines.
2.The font is being "lift upwards", and as a result, the top of the text is chopped off and there is a visible padding below text.I added "vertical-align:-1pt" and still some text are hanging.
3.Huge blank space on the sides of the text on nearly all sites.See the Qwant screenshot.
Screenshots are attached.Note that I am using 50% zoom.
Here is the CSS:
* { /* Apply to everything */ font-size: 12pt; /* The font is 6*12 pixels */ line-height: 13pt; /* 1 pixel between lines */ margin: 0; padding: 0; /* For a more compact layout */ text-align: start; align-content: flex-start; alignment-baseline: baseline; vertical-align:-1pt; }
Sign In or Register to comment.