『HTML5プレーヤーにおける高さ固定』の勝手に補足記事

oztoさんが公開してる以下の記事、について勝手に補足した記事です。

HTML5プレーヤーにおける高さ固定【CAテンプレート】

full+幅リサイズは互換性が低い

スマートフォンではコメント表示領域がディスプレイのサイズによって変わるため、
full+幅リサイズの組み合わせは互換性が非常に低いです。

詳しくは以下の記事

Androidのコメント表示領域がおかしい話（2021/09/08追記）

近年のスマホは縦長になる傾向が顕著で、主要なメーカーの機種は16:9ではありません。

つまり、ほとんどのデバイスで全画面視聴時にfull＋幅リサイズの組み合わせを用いたコメントはズレます。

注意したいのが、縦にズレるだけでなく、横にも大きくズレます。
なおかつ想定したサイズよりも基本的に拡大されるため画面を覆い隠してしまう可能性もあります。

このため、スマホ互換を考える場合、full+幅リサイズの組み合わせは避けるのが無難です。

というわけで、oztoさんが公開されているテンプレの代替案として
非fullのテンプレ幅、二重リサイズのテンプレ幅
を以下に紹介します。

注意事項

画像の下部に表示されているのは「行数　幅　コマンド」です。

『行数』は画面内に表示される行数です。
完全に固定したい場合はこれに＋１行します。

『幅』は行内のコメントの幅です。
基準幅（漢字幅）がU+2003、1/3がU+2004、1/4がU+2005
例：3+1/3 = U+2003×3 + U+2004 ×1

『コマンド』はueもしくはshitaです。
ueとshitaの違いによるズレを表しています。

非fullのテンプレ幅の大きさについてのコマンドは全て『ender big』です。
二重リサイズのテンプレ幅の大きさについてのコマンドは全て『big』です。
幅リサイズを使わなくて固定可能な13行、16行、21行は省いています。

非fullのテンプレ幅

二重リサイズのテンプレ幅

※二重リサイズの場合、ueとshitaが対称な11行の幅はない。