Codex trouble guide

CSSが崩れた時の確認

Codex作業後にCSSが崩れた時の確認方法を整理します。CSSキャッシュ、クラス名、共通CSS、スマホ表示、差分確認、戻す対象を扱います。

このページは非公式の実務ガイドです。重要な判断は人間が行い、最新情報は提供元の情報も確認してください。
trouble-check.md
stop:
  - unclear_cause
  - risky_change
check:
  - public_url
  - changed_files
  - rollback_scope

このページで分かること

Codex作業後にCSSが崩れた時の確認方法を整理します。CSSキャッシュ、クラス名、共通CSS、スマホ表示、差分確認、戻す対象を扱います。

起きている症状

ヘッダーが折れる、カードが横にはみ出す、スマホ表示だけ崩れる、共通CSS変更後に複数ページの見た目が変わる状態です。

最初に確認すること

  • 崩れたページと崩れていないページを比べる
  • 共通CSSを変更したか確認する
  • クラス名の追加・削除を確認する
  • キャッシュの影響を切り分ける
  • スマホ390pxでも確認する

Codexに再確認させる指示文

CSS崩れが出ています。崩れたページ、影響範囲、変更したCSS、クラス名、スマホ表示、戻す対象を確認し、大幅改修せず最小修正案を報告してください。

やってはいけないこと

  • 全体CSSを勢いで書き換える
  • PCだけ見て完了する
  • 共通クラス名を別用途に流用する
  • 画像やロゴサイズを確認しない

戻す判断

共通CSSが原因なら、対象ブロックだけの調整か、直前CSS変更の差し戻しを検討します。

確認チェックリスト

  • PCで横はみ出しがない
  • スマホ390pxで読める
  • ヘッダーとフッターが崩れていない
  • 画像が切れていない
  • CSSが200 OK

次に読むページ