Xah Talk Show 2025-12-05 Ep719 new CSS units, lh cap ic. emacs xah css mode. typing chinese in emacs.

Video Summary (Generated by AI, Edited by Human.)

Discuss new CSS length units. Updates Xah Lee CSS tutorial with these new units and demonstrates their usage and the challenges encountered during testing.

Key topics covered include:

• Introduction to new CSS Length Units (0:40-1:50): lh (line height), cap (capital letters height), ic (Chinese character "water" width/height), and rcap, ric, and rlh.
• Demonstrating LH unit (3:31-10:24): Test the LH unit for font-size. He initially faces issues but later discovers a typo in "font-size" (8:17-8:20).
• Updating Emacs CSS Mode (10:30-15:20): update Emacs Xah CSS mode to recognize and highlight the newly introduced CSS units.
• Understanding IC unit and Chinese Input in Emacs (17:53-21:00): The video delves into the IC unit, which is based on the width/height of the Chinese character for "water." Xah Lee demonstrates how to type Chinese characters using emacs's own input method.
• Understanding cap unit (22:25-26:00): Xah Lee explains the cap unit, which represents the nominal height of capital letters. He clarifies the long-standing problem in CSS where font-size doesn't reflect visual size of letters due to font design variations.
• Demonstrating Font Family Impact on Layout (1:00:29-1:02:50): The host demonstrates how changing font families can significantly alter the layout of a webpage, even when the font-size remains constant.
• Discovery of a Firefox Bug (37:50-40:50, 1:10:02-1:10:55): Xah Lee uncovers a potential bug in Firefox where specifying a font family like "Arial" without a generic fallback (e.g., sans-serif) results in Firefox defaulting to a serif font. This behavior is inconsistent with other browsers like Brave and is identified as a significant issue for web development.
• Discussion on Ergonomic Keyboards (1:05:15-1:08:41): briefly discusses ergonomic keyboards, comparing the Ultimate Hacking Keyboard (UHK80) and the Glove 80.

seems like we discoverd a bug in Firefox.

if you have css font-family value is a specific font, e.g.

p {
 font-family: "Arial";
}

but without specify generic font family such as serif or sans-serif, then, it behaves like

p {
 font-family: serif, "Arial";
}