asp.net.ph

Skip Navigation Links

layout-grid-type Attribute | layoutGridType Property

CSS Attributes Index   Box Attributes


Sets or retrieves the type of grid to use for rendering the text contents of an element.

Syntax


CSS { layout-grid-type: 'loose' | 'strict'}
Script [ 'loose' | 'strict' = ] oObject.style.layoutGridType

Possible Values


loose String indicating the grid used in Chinese ( "Genko" ) and Korean. Only the ideographs, kanas and wide characters are snapped to the grid. Other characters are rendered as usual as though the layout-grid-mode attribute was set to none or line for text spans containing those characters. This mode also disables special text justification and character width adjustments normally applied to the element. Finally, if a line break opportunity cannot be found in a text span going over the line boundary, it will be pushed to the next line and the last part of the previous line will be left blank.
strict String indicating the grid used in Japanese. In this mode, a constant width increment is applied to characters as follows:
  • the wide characters get an increment to get exact grid fit if no other width adjustment effect is applied.
  • narrow characters ( except cursive scripts and from cursive fonts ) get half the increment applied to wide characters.

The property is read/write with a default value of loose; the proposed cascading stylesheet ( CSS ) extenstion attribute is inherited.

Remarks

Characters in East Asian languages, such as Chinese or Japanese, commonly use page layout for characters according to a one- or two-dimensional grid.

The layout-grid-type attribute only applies to block level elements.

Example

The following sample demonstrates the use of the layout-grid-type attribute to specify character layout for a block of text.

<style>
DIV.layout {layout-grid-type: "strict";}
</STYLE>

<div CLASS = "layout">
This is a block element containing a 
  sentence of sample text.
</div>


© 2025 Reynald Nuñez and asp.net.ph. All rights reserved.

If you have any question, comment or suggestion
about this site, please send us a note