Fandom

HTML & CSS Wiki

Layout-grid-type

649pages on
this wiki
Add New Page
Comments0 Share

The CSS layout-grid-type property controls the type of layout grid used when rendering an element's text content. It is used because Asian languages often employ page layout for characters for better visual formatting using a one or two-dimensional grid.

ValuesEdit

Value Description
loose Indicates the line-grid commonly used in Chinese and Korean text display. Chinese characters, kana and wide characters have the grid applied. All other characters are rendered as if layout-grid-mode was set to none or line. CSS properties and values that would otherwise change the width of a character (such as text-align:justify;) are disabled.
strict Indicates the line-grid used in Japanese text display. Narrow characters (except content from "cursive" fonts) get half the grid increment applied to wide characters. Wide characters receive a grid increment if no other width adjustment is used.
fixed The type of line-grid used in mono-space layout. All characters receive and are centered within an equal grid spacing (except content from "cursive" fonts.) CSS properties and values that would otherwise change the width of a character (such as text-align:justify;) are disabled.


HTML example:

<div style="layout-grid-mode:both; layout-grid-type:loose;
layout-grid-char-spacing:15px;">
Content snapped to a layout grid</div>


CSS example:

div {
     layout-grid-mode:both;
     layout-grid-type:loose;
     layout-grid-char-spacing:15px;
}

See AlsoEdit

Ad blocker interference detected!


Wikia is a free-to-use site that makes money from advertising. We have a modified experience for viewers using ad blockers

Wikia is not accessible if you’ve made further modifications. Remove the custom ad blocker rule(s) and the page will load as expected.