bigの使用による見切れ現象は、marqueeに原因があります
marqueeの特徴として『デフォルトでは1行分の高さしか表示しない』というものがあります
サイトのページがスマホ用、パソコン用問わず発生するため、恐らくosか端末依存であり、作る人(運営)による改善を期待するには難しい領域かと思われます
ウィンドウサイズを極端に小さくした、スクロール不可能なブラウザというべきでしょうか。私の語彙力では少々説明できそうにありません
具体的には、このような「2行の文章をスクロールする」場合などが該当するでしょう
この場合、スクロールで表示されるのは
《marquee:normal》
《bgcolor:#0f0》test《/bgcolor》
《bgcolor:#0f0》test《/bgcolor》
《/marquee》
なので解決策としては「marqueeの縦方向の範囲を広げる」という手があります
これはmarquee:h○というコマンドで解決可能です
具体的にはこのようなものです
《marquee:h4,normal》
《bgcolor:#0f0》test《/bgcolor》
《bgcolor:#0f0》test《/bgcolor》
《/marquee》
ただし注意点として、1行分の高さというのは「行間の空白」も含みます
この行間の空白はデフォルトだと
①スマホページ:70%
②パソコンページ:100%
であり、微妙に異なります。ここを忘れて「1行ならh1だな」とやると、下の部分が表示されないことになります
不安なら、動画のスクリーン部全体をbox:lh2.0で挟み込んでおいた方が安全かと思われます。パソコンよりの表記に寄せるわけです
boxは入れ子に出来ます故、動作に差し障りはありません
次にスクロールバーが現れてしまう件についてですが、一番簡単な予防方法は《box:overhidden》と入力することです
このコマンドは「スクロールバーを消失させる」という効果を持ち、こういった再現系では引っ張りだこの存在です
―を拡大すると上にずれる原因は、■を拡大すると分かりやすいです
というのもハーメルンは、文字を拡大縮小した際は下端を揃えて表記します。wordなどの文字サイズを変更できる文章編集ツールと同様です
次に、centerやleftを併用すると改行してしまう原因について
実はcenterとleft,rightでは挙動が微妙に異なります
それぞれ特徴を纏めると
・center
①画面の横幅いっぱい(box:w100%で固定)
②タグの前後で改行を発生させる
《box:bo#000》
test《center》《box:bg#0f0》 《/box》《/center》test
《/box》
・left,right
①入力した文字によって左右の範囲が変動(box:inlineと似た効果)
②タグの後ろに限り、改行を発生させない
《box:bo#000》
test《right》《box:bg#0f0》 《/box》《/right》test
《/box》
《box:bo#000》
test《left》《box:bg#0f0》 《/box》《/left》test
《/box》
という風になっています
なので『改行を発生させない』ことの解決策としては、順番を入れ替えればいいだけだったりします
タグの後ろでは改行を発生させないleft,rightを最初に、最後にcenterを持ってくれば良いのです
《box:w100%,bg#000000,p0.2,overhidden》《left》《white》《font:u58》 さ お《/font》《/white》《b》《sub》《xbig》《big》《blue》 ――《/blue》《gray》―《/gray》《/big》《/xbig》《/sub》《/b》《/left》《right》《white》《font:u58》こ ⤡ ⟳ し《/font》《/white》《/right》《center》《white》03:34/25:25《/white》《/center》《/box》
これはこれで「左右部を除いた中央に位置取る」都合でずれが生じますが
色付けすると、再生時間が赤背景の中央部に来ることが確認できます
《box:w100%,bg#000000,p0.2,overhidden》《left》《box:bg#0f0,overhidden》《white》《font:u58》 さ お《/font》《/white》《b》《sub》《xbig》《big》《blue》 ――《/blue》《gray》―《/gray》《/big》《/xbig》《/sub》《/b》《/box》《/left》《right》《box:bg#0f0,overhidden》《white》《font:u58》こ ⤡ ⟳ し《/font》《/white》《/box》《/right》《center》《box:bg#f00,overhidden》《white》03:34/25:25《/white》《/box》《/center》《/box》
私は面倒なので重ね字使って強引に突破します
《box:w100%,bg#000000,p0.2,relative,overhidden》《left》《white》《font:u58》 さ お《/font》《/white》《b》《sub》《xbig》《big》《blue》 ――《/blue》《gray》―《/gray》《/big》《/xbig》《/sub》《/b》《/left》《right》《white》《font:u58》こ ⤡ ⟳ し《/font》《/white》《/right》《box:absolute(0/0),w100%,p0.2,overhidden》《center》《white》03:34/25:25《/white》《/center》《/box》《/box》
最後に、タグの起動防止について
御作では■を用いていましたが、それよりも|《》を用いた方が良いかと思われます
特殊タグは正確な入力を要し、邪魔なものがあると動作を停止します
それを逆手に取り『タグのみを挿入』することで、外見上は変化がないにも関わらず、タグの動作を停止させることが出来ます
《|《》red》動作しない。コピペすると動作《/red》
アスペクト比を安定化させる手法もありますが、あれは『タグ内で一切改行が出来ないため、重ね字で改行しているように見せかける、ブロックタグで強引に改行させる』といった阿呆みたいな力業を要するので省かせていただきます
-追記-
訂正 marqueeに関して
《box:lh2.0》は無い方が良い可能性があります
そもそも《box:lh》というのは行間(閲覧設定参照)を変更する要素ですので、文字サイズが行間を下回るなら不用意に弄らない方が良い要素です
少々動作を見たところ、当方の環境では無い方が良さそうでした
ブラウザ、OS、端末の世代、本体の文字サイズ設定などで変動しうるので一概には言えませんが…
▲短縮する