行(文章の列)を改める(次の行に進む)こと。
<img>
}{希哲16年4月4日の進捗時限}{希哲16年4月4日}{進捗記録}{上下マージン}...
{希哲16年4月4日7歩 K#F85E/E74C-9983}
resize: vertical
}{高過ぎず}...
{希哲16年3月30日の開発 K#F85E/E74C-7061}
描写欄の高さの問題をきっかけに自動リサイズ機能と字数計の実装が出来た。ほか装体調整など。
自動リサイズ機能
旧輪郭選り手では,描写欄の出放りの高さを新規描出フォームで10em,再描出フォームで15emとしていたが,新輪郭選り手ではたまたま15emで統一されていた(画面撮り)。10emでは長文が書きにくいのでこれはこれでいいかと思ったが,やはり新規描出フォームは一言だけや知名だけの描出に使うことも多いためこの高さでは邪魔臭い。
ここで,予てからぼんやり検討していた自動リサイズ機能の導入を考えた。一応 resize: vertical
は設定してあるが,万能ではない。10emから20em程度までの範囲で,改行毎に自動リサイズさせる。導入予定の字数計では字数情報が必要になるため,一緒に行数も保持させることにした。
実際に試してみると,1em刻みでも2em刻みでも違和感があったため,10emから19emまで1.5em刻みでリサイズするようにした(画面撮り:初期状態,最大自動リサイズ)。19emだと個人機でも低過ぎず高過ぎず,スマートフォンの縦向きで柔品キーボードを表示させてもちょうど収まる程度の高さになる。折り返しの多い1行もありうるため,厳密にするなら字数も考えるべきだが,とりあえずはこれで様子を見ることにした。
再描出フォームに関しては,さほど目立つものでもなく,描写部の高さに合わせて描写欄が開くようになっている現仕様が悪くないので,現状維持で様子見しておく。
字数計
字数・行数の保持が出来たことで字数計も難無く実装出来た。描出ボタンか時印の左側に邪魔にならないように表示させてみた(字数計の様子)。
下見の字数と分けようかと思っていたが,下見を開いている時は下見の字数に置換すれば十分であることに気付いた。一応,見分けが付くように頭に「→」を付けるようにした。
これも,厳密に考えると特殊な文字符号などを考慮する必要があるが,キリがないのでとりあえず .length
による概算でよしとしておく。
字数計は,地味ながら意外に需要があることを市場調査を通して知った。自分でもたまに欲しくなることがあった。
overflow: hidden
}{進捗記録}{希哲16年3月2日の開発}{希哲16年3月2日の進捗}{希哲16年3月2日}{position: relative
}{overflow: clip
}{調整していく}{揃わなくなる}{縦位置}...
{希哲16年3月2日10歩 K#F85E/E74C-FDA9}
描写内 <code>
,<kbd>
の装体調整で終了。これまで適当にしていた高さと垂直位置を調整した。
特に,輪結の下線と枠が被っているのが気になっていたので直したかったが,意外に正確な調整が難しく,かなり試行錯誤した。
最終的に,<code>
と <kbd>
は position: relative;
display: inline-block
にし,下線との隙間は bottom
で調整することにした。あとは height
,line-height
,padding
で微調整を繰り返し,ようやくどの舞覧で見ても大きな問題はないようになった。
舞覧毎に僅かな癖は残るが,だいぶマシになったのでとりあえずここで区切る。課題は残ったので暇をみてまた調整していく。
- 途中で不自然に改行されてしまう問題も行内部区になったことで解消した。
<a>
のpadding-bottom
での調整は断念。ルビとの相性が悪く,行間も現状のline-height: 1.8
は変えにくい。- Edge では他の舞覧のように下線の位置が下がらないため相変わらず被っている。

{希哲16年2月27日10歩 K#F85E/E74C-86FF}
dimgray
}{進捗記録}{gray
}{概ね満足}{line-height: 1.8
}{line-height: 1.4
}{開き過ぎる}{font-size: 0.8em
}{font-size: 0.9em
}{font-size
}...
{希哲16年1月15日1歩 K#F85E/E74C-3A37}

{希哲15年7月6日8歩 K#F85E/E74C-87B0}
いったん終了。
これまで,段落間の余白は0.5emほど開けて1em分の字下げを text-indent で設定していたが,自動字下げは廃止し,代わりに字下げ記法を導入することにした。
字下げ記法では,行頭に所定のスペース(例えば日本語なら全角スペース1つ)を置くことで text-indent を設定出来るようにする。Markdown 等で採用されている4つの半角スペースでの交度記法などの導入をどうするかはまだ決まっていないため,まずは衝突しないように限定的な導入に留める。
また,改行については,これまで通り1行の空行を段落分けに使い,半行分の余白を開ける。2行の空行で1行分の余白,それ以降は1行分ずつ余白を追加していくように装体を厳密化する。
字下げ記法により改行無しで段落を表現出来るようにすることも検討する。この場合,段落間余白無しで字下げのみを使った段落表現も出来るようにする。
段落の字下げは,段落間の余白とともに文書の性質や書き手・読み手の好みによって制御出来るようにしておいた方がデライトの活用範囲が広がるだろう。
従来の段落装体は恐らくデルン最初期に調整したもので,長い文章を書く時は便利に感じていたが,例えば,どんな表示環境でも改行されないような一言程度でも字下げが入るため,内容によっては不自然に行頭が揃っていないように見える,といった問題があった。
段落間の余白を広げ過ぎると縦の空間を消費し過ぎかえって視認性に問題があるため,代わりに字下げを導入したような微かな記憶がある。
ただ,日本語版 Wikipedia でも英語版 Wikipedia でも0.5emの段落間余白で字下げ無しという装体なので,特別読みにくいということもない。
最初は字下げ無しを指定出来るような記法を導入することを考えたが,そんなややこしいことをするくらいならこちらの方がすっきりするだろう。
