Tag

line-height

0 views collected around this technical thread.

NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
May 31, 2022 · Frontend Development

Fin Line Height Fix Tool: Solving Visual Fidelity Issues in Design-Development Collaboration

The article introduces the Fin Line Height Fix Tool, an open‑source solution from NetEase’s Dolphin team that resolves visual fidelity problems caused by inconsistent font heights between design tools and implementation, offering Figma and Sketch plugins plus iOS, Android, and React Native code to ensure pixel‑level line‑height consistency and streamline designer‑developer collaboration.

AndroidFigmaReact Native
0 likes · 8 min read
Fin Line Height Fix Tool: Solving Visual Fidelity Issues in Design-Development Collaboration
NetEase Cloud Music Tech Team
NetEase Cloud Music Tech Team
Sep 9, 2020 · Frontend Development

Understanding Font Metrics and Vertical Alignment for Accurate CSS Vertical Centering

The article explains why common CSS vertical‑centering tricks can leave pixel offsets when fonts differ, details how font metrics such as ascent, descent, and x‑height determine the true baseline, and provides a calculable vertical‑align offset method—while noting its metric‑gathering overhead and anticipating native Houdini support.

CSSFont Metricsfrontend
0 likes · 16 min read
Understanding Font Metrics and Vertical Alignment for Accurate CSS Vertical Centering
Yuewen Frontend Team
Yuewen Frontend Team
Jun 26, 2018 · Frontend Development

Why 16px Should Be the Default Font Size for Front‑End Design

The article explores how front‑end typography standards—covering base font size, font‑scale formulas, and line‑height rules—can be derived from visual ergonomics, mathematical ratios, and practical engineering constraints, ultimately recommending 16 px as the optimal base size and a line‑height of font‑size + 8.

Ant DesignCSSDesign Guidelines
0 likes · 17 min read
Why 16px Should Be the Default Font Size for Front‑End Design
Tongcheng Travel Technology Center
Tongcheng Travel Technology Center
Jul 20, 2017 · Mobile Development

Common Mobile Webview Styling Pitfalls and Practical CSS Tips for Android and iOS

This article summarizes frequent CSS rendering inconsistencies across Android and iOS webviews, covering line‑height quirks, multiline ellipsis, badge implementation, image‑text layouts, adaptive width handling, inline‑block behavior, and simulated scrolling, while offering concrete code snippets and visual examples.

CSSWebViewlayout
0 likes · 7 min read
Common Mobile Webview Styling Pitfalls and Practical CSS Tips for Android and iOS