Diagnosis
この所見が意味すること
px固定のwidthまたはmin-widthが現在の表示幅を超える可能性があります。
所見は断定ではありません。表示された根拠と設計意図を照合してから本番コードを変更してください。
Detection
CSS Doctorの判定方法
- 貼り付けたHTML・CSSをネットワーク遮断したiframe内で隔離表示します。
- 静的ルールはソース構造を、表示ルールは実際の寸法や計算済みスタイルを確認します。
- 目的、重要度、確度、影響範囲、修正安全度の順で所見を並べます。
Before / After
最小コード例
確認前
.card { width: 720px; }修正の方向例
.card { width: min(100%, 720px); }例は出発点であり、万能な修正ではありません。Tier A・Bは適用前に差分を表示し、Tier Cは自動適用しません。
Limitations
検出の限界と手動確認
意図した横スクロールUIでは外側のoverflow設計を確認します。
- ツールへ貼っていない本番CSSは取得・比較しません。
- 入力したJavaScriptは実行しません。
- すべての画面幅とキーボード操作で最終確認してください。
Paste Labでこのルールを試す
貼り付けたソースはこのブラウザ内だけで処理し、URLやアクセス解析には含めません。
CSS Doctorを開く