LAYOUT-003 / HYBRID

Fixed width exceeds its container

A fixed pixel width or minimum width can exceed the selected viewport.

Rule v1.0.0 Safety Tier B 日本語

Diagnosis

What this finding means

A fixed pixel width or minimum width can exceed the selected viewport.

A finding is not a verdict. Check the displayed evidence and the design intent before changing production code.

Detection

How CSS Doctor detects it

  1. CSS Doctor isolates the pasted HTML and CSS in a sandboxed iframe.
  2. Static rules inspect source structure; runtime rules measure the rendered result.
  3. Evidence is ranked by intent, severity, confidence, affected area, and fix safety.

Before / After

Minimal example

Before review

.card { width: 720px; }

Possible direction

.card { width: min(100%, 720px); }

The example is a starting point, not a universal patch. CSS Doctor previews Tier A and B changes before applying them and never auto-applies Tier C guidance.

Limitations

Limits and manual checks

For intentional horizontal scrollers, review the overflow container.

  • Production stylesheets not pasted into the tool are not fetched.
  • JavaScript is never executed from user input.
  • Verify the result at all breakpoints and with keyboard input.

Test this rule in Paste Lab

Your pasted source stays in this browser and is not added to the URL or analytics.

Open CSS Doctor