layout-grid-type:配置方法
layout-grid-char:文字間隔
layout-grid-mode:設定の有無

---

配置方法：

loose	全角文字の場合、layout-grid-charで指定した余白をあける
strict	layout-grid-charで指定した余白のマスをつくり、全・半角文字をその1マスの中央に配置する
fixed	layout-grid-charで指定した余白のマスをつくり、全・半角以外に文字筆記体も1マスの中央に配置する

文字間隔：

auto	文字列の中で最も横幅のある文字で決定する
none	変更しない
単位つきの数値
%

設定の有無：

char	charで指定した値を有効にする

layout-grid-charプロパティで文字の間隔を指定し、layout-grid-typeプロパティで配置の方法を指定し、layout-grid-modeプロパティで設定の有無を指定します。
layout-grid-charプロパティで指定された大きさの透明なボックスを作り、これを文字と文字の間に設置することによって一定の文字間隔をあけています。

また、同じやり方で一定の行間隔をあける方法もあります。
詳しいことは『一定の行間隔をあける』を御覧ください。

さらに、layout-gridプロパティを使えば、文字間隔と行間隔をまとめて指定することができます。
詳しいことは『文字間隔や行間隔をまとめて指定する』を御覧ください。

文字と文字の間にあける間隔を、単位つきの数値で指定します。
詳しいことは、『単位の指定方法』を御覧ください。
　・　{ layout-grid-char:10pt; }
　・　{ layout-grid-char:2em; }

文字と文字の間にあける間隔を、親要素の幅に対する割合をパーセントで指定します。
　・　{ layout-grid-char:3%; }
　・　{ layout-grid-char:10%; }

layout-grid-char : none (文字間隔の指定なし)

layout-grid-char : 8pt
(文字間隔：8pt，フォント：ＭＳ　ゴシック)

layout-grid-char : 8pt
(文字間隔：8pt，フォント：MS UI Gothic)

<STYLE type="text/css">
<!--
.case1 {
layout-grid-type:loose;
layout-grid-char:none;
layout-grid-mode:char;
}
.case2 {
layout-grid-type:loose;
layout-grid-char:8pt;
layout-grid-mode:char;
}
-->
</STYLE>

<H5>layout-grid-char : none (文字間隔の指定なし)</H5>
<DIV class="case1">待ちに待った猫が我が家にやってきたからといって、かまいすぎるのは避けましょう。人間でもはじめての家に行くと緊張するもの。まして、猫は親兄弟と離れて心寂しいはず。そっと家の中に放して勝手に歩き回らせましょう。好奇心の強い猫はニオイを嗅ぎながら家中を観察しはじめ、新たな環境に慣れようとします。</DIV>

<H5>layout-grid-char : 8pt<BR>
(文字間隔：8pt，フォント：ＭＳ　ゴシック)</H5>
<DIV class="case2"><FONT face="ＭＳ ゴシック">待ちに待った猫が我が家にやってきたからといって、かまいすぎるのは避けましょう。人間でもはじめての家に行くと緊張するもの。まして、猫は親兄弟と離れて心寂しいはず。そっと家の中に放して勝手に歩き回らせましょう。好奇心の強い猫はニオイを嗅ぎながら家中を観察しはじめ、新たな環境に慣れようとします。</FONT></DIV>

<H5>layout-grid-char : 8pt<BR>
(文字間隔：8pt，フォント：MS UI Gothic)</H5>
<DIV class="case2"><FONT face="MS UI Gothic">待ちに待った猫が我が家にやってきたからといって、かまいすぎるのは避けましょう。人間でもはじめての家に行くと緊張するもの。まして、猫は親兄弟と離れて心寂しいはず。そっと家の中に放して勝手に歩き回らせましょう。好奇心の強い猫はニオイを嗅ぎながら家中を観察しはじめ、新たな環境に慣れようとします。</FONT></DIV>