HTML Baseline Adjustment via Spacer Elements for Uniform Line Spacing

Resolve Bottlenecks,
Find Innovative SolutionsGenerate Solutions

Solution Overview

Problem

Cloud-based word processing documents often exhibit uneven line spacing due to variations in font types and sizes, leading to visually unappealing text rendering on web browsers, and this issue is exacerbated across different client computers with varying hardware and browser settings, as HTML and CSS lack direct control over baseline positioning.

Innovation Solution

A method is implemented where a cloud computing service sends a document to a client computer with a rendering function that inserts a spacer element with a height greater than the maximum text height, allowing for customizable baseline and line spacing by adjusting the vertical position of the text using an offset, ensuring uniform line spacing across all lines of text.

Engineering Contradictions & Design Principles

VSEngineering Contradiction Analysis

1Ease of operation

If HTML automatically calculates baseline based on font type and size, then text rendering is simple and compatible, but line spacing becomes uneven and visually unappealing

Engineering Contradiction:

Improvetext rendering simplicityVSAvoidline spacing uniformity

Core Design Contradiction:

Ease of operationVSManufacturing precision

Solution Approach 1:

The patent introduces a baseline adjustment mechanism that acts as an intermediary between the automatic baseline calculation and the final text rendering. This mechanism calculates adjustment values based on font properties and applies them to uniformify line spacing, thereby mediating between simple automatic rendering and precise line spacing control.

Inventive Principle:

Principle #24Intermediary (Mediator)

Solution Approach 2:

The patent changes the baseline parameter dynamically based on font type and size. By detecting font properties and calculating corresponding baseline adjustments, the system modifies the baseline parameter to compensate for variations caused by different fonts,从而实现均匀的行间距.

Inventive Principle:

Principle #35Parameter changes

2Adaptability or versatility

If different client computers with varying hardware and browser settings are used, then system compatibility and adaptability are improved, but line spacing consistency deteriorates

Engineering Contradiction:

Improveclient computer compatibilityVSAvoidline spacing consistency

Core Design Contradiction:

Adaptability or versatilityVSStability of the object's composition

Solution Approach 1:

The patent dynamically adjusts baseline parameters based on detected font properties in different client environments. By changing the baseline parameter according to font type and size, the system compensates for variations across different clients, maintaining line spacing consistency despite environmental differences.

Inventive Principle:

Principle #35Parameter changes

Solution Approach 2:

The patent implements a feedback mechanism that detects font properties in the client environment and uses this information to calculate appropriate baseline adjustments. This feedback loop ensures that line spacing is adapted to each client's specific font rendering characteristics, maintaining consistency across different platforms.

Inventive Principle:

Principle #23Feedback

3Adaptability or versatility

If multiple font types and sizes are used in a paragraph, then text formatting flexibility is improved, but baseline position variation and line spacing inconsistency worsen

Engineering Contradiction:

Improvefont formatting flexibilityVSAvoidbaseline position uniformity

Core Design Contradiction:

Adaptability or versatilityVSManufacturing precision

Solution Approach 1:

Inventive Principle:

Principle #35Parameter changes

Solution Approach 2:

The patent applies different baseline adjustments to different lines of text based on their specific font properties. Each line receives a customized baseline adjustment tailored to its font type and size, allowing local optimization of line spacing while maintaining overall document flexibility.

Inventive Principle:

Principle #3Local quality

Data Source

PatentUS9275022B2Mechanism for setting ascent and baseline for HTML elements

Publication Date: 2016.03.01 GOOGLE LLC

AI summary

A method for rendering a document on a web browser includes receiving a portion of text within the document to be rendered on a web browser and determining a maximum height of the portion of text. A spacer element is inserted into the portion of text, where the spacer element has a height greater than the maximum height of the portion of text. A vertical position of the portion of text and the spacer element is adjusted by an offset, where a baseline of the portion of text is determined from the height of the spacer element and the offset. The portion of text is rendered on the web browser based at least in part on the baseline.