HTML & CSS Wiki

READ MORE

HTML & CSS Wiki

The CSS layout-grid-char-spacing property controls the character spacing granularity when the layout-grid-mode is set to char or both, and the layout-grid-type property is set to loose. Visually, this property has an effect similar to the line-height property. It is used because Asian languages often employ page layout for characters for better visual formatting using a one or two-dimensional grid.

Values[]

Value Description
auto The largest character in the font for the current element is used to determine the character grid spacing.
<length> Refers to either an absolute measurement or a relative measurement based on the current element's font size. Examples are cm, pt, px, etc.
<percentage> The percentage is relative to the height/width of the parent element.


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 Also[]