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;
}
