- 2026.10.15
- サーバー移行,
レンタルサーバーの乗り換えでドメインはどうする？移管は原則不要・止まるのは「サイト」より「メール」
レンタルサーバーを乗り換えるとき、独自ドメインは移管せずネームサーバー変更だけで足ります。サイトは止めずに済む一方で受信漏れが起きやすいメールの扱い、移管の条件（認証コード・60日・Whois）、乗り換え費用と移行代行の範囲を公式ページから当日取得した値で整理しました。
Web制作Tips（コーディング実務）
1/4ページ
- 2026.10.14
- サーバー移行,
レンタルサーバーの法人向けと個人向けは何が違う？請求書・サポート・SLA・メールの5点で見分ける
レンタルサーバーの「法人向け」と「個人向け」の違いを、性能ではなく業務要件で整理。請求書払いと見積書、サポート窓口の受付時間、SLA（稼働保証）の対象範囲、メールの作り、管理者を複数置けるかの5点を、エックスサーバー／XServerビジネス／CPIの公式ページから当日取得した記載だけで突き合わせます。勧めない人の条件まで制作実務目線で解説。
- 2026.10.13
- サーバー移行,
エックスサーバーの料金はいくら？3プラン×5つの契約期間を総額で全部計算して、どれを選ぶか決める
エックスサーバーの料金を「月額」ではなく「契約期間ごとの総額」で整理。スタンダード/プレミアム/ビジネス×3〜36ヶ月の料金を公式ページから当日取得して表にし、一括前払いの総額を再計算。プラン選びの判断基準と、勧めない人の条件までWeb制作の実務目線で解説します。
nth-childが効かない原因9パターン｜Chromium 141で実測した「nth-of-typeとの違い」と範囲指定の正解
:nth-child(2)を書いたのに狙った要素に当たらない——原因は「nth-childが要素の種類を見ていない」ことに集約されます。Chromium 141でnth-childとnth-of-typeの一致要素、display:noneの要素が数に入ること、暗黙のtbody、グリッドの行末が取れない理由、先頭挿入の再計算コストまで実測。奇数偶数・3n+1・範囲指定の書き方と、of S記法による正解まで整理します。
vertical-alignが効かない原因10パターン｜Chromium 141で全13値を実測した「中央に来ない」の正体
vertical-align:middleを書いたのに中央に来ない——原因は「適用対象」と「基準線」の2つに分かれます。Chromium 141で全13値をピクセル単位で実測し、centerという値が存在しないこと、block要素では1pxも動かないこと、基準が親の高さではなくベースラインであること、flex/grid/float/absoluteでは無視されることを数値で検証。上下中央の正解と、原因を1発で切り分ける診断スニペットまで整理します。
- 2026.10.10
- CSS, JavaScript, UI実装, デバッグ,
transitionが効かない原因と直し方｜display:noneからの表示・@starting-style・allow-discreteを切り分け手順で整理
transitionを書いたのにアニメーションしない、モーダルは閉じるときだけ効く、初回だけ効かない——原因は「display:noneからの表示では補間の開始値が存在しない」という一点にほぼ収束します。従来のrequestAnimationFrame二重呼び出しによる回避から、@starting-styleとtransition-behavior:allow-discreteを使う現在の正攻法まで、切り分けの順番・そのまま貼れるコード・原因を3分で特定するコンソールスニペットを実務手順で整理します。
text-overflow: ellipsisが効かない原因と直し方｜flex・grid・line-clampで必ず踏む落とし穴を実測で解説
text-overflow: ellipsisや-webkit-line-clampが効かない原因を、Chromium 141の実測値で切り分け。flex/gridの中で省略されない理由、white-space:nowrapが要る条件、padding-bottomで3行目が覗く現象まで、コピペで使える診断スニペット付きで解説します。
marginが効かない・余白が消える原因はマージンの相殺｜Chromium 141の実測で「止まる書き方」を切り分ける
margin-topが親の外に飛び出す、指定した余白が合計されない、空divで余白が消える——原因はすべてマージンの相殺です。どのCSSで相殺が止まるのかをChromium 141で実測し、overflow:clipは止まらない・padding-top:0.01pxは丸められて無効といった実務で踏む落とし穴まで、コピペで使える診断スニペット付きで解説します。
日本語の改行がおかしい・URLがはみ出す原因｜word-break / overflow-wrap / line-break の使い分けをChromium 141で実測
長いURLがカードからはみ出してスマホに横スクロールが出る、長音符「ー」が行頭に来る、見出しの最後に1文字だけ残る——日本語サイトの改行トラブルを、Chromium 141で実描画して切り分けます。overflow-wrap:break-wordが効かない理由（min-content幅303px→縮まない）、word-break:break-wordとの決定的な違い、line-break:strictの効果、text-wrap:balanceの実測値まで、コピペで使う指定と診断スニペット付き。
::before / ::after が表示されない原因と直し方｜content・置換要素・inlineの3点をChromium 141で実測
CSSを書いたのに::beforeが出ない——原因はほぼ3つです。contentを書き忘れてボックスが生成されていない、imgやinputなどの置換要素に付けている、displayがinlineのままでwidth/heightが無視されている。Chromium 141で実際に描画してピクセル単位で検証し、background-imageのアイコンが消える理由、absoluteの基準が親にならない条件、疑似要素がコピーされないのに読み上げられる挙動まで、診断スニペット付きで整理します。