Dart New Added 10 September 2026

Flutter: A RenderFlex overflowed by 42 pixels on the right

A Row or Column laid out children that want more space than the parent offered, so the excess is painted as the yellow and black stripes. The number is the overflow, not the required width, and the fix depends on intent: a child that should shrink needs Flexible, one that should scroll needs a scroll view.

Quick fix

Read the commands before running them. Anything that restarts a service, deletes data or changes permissions should be tried on a non-production system first.

Quick fix

// Text that should shrink or wrap inside a Row
Row(children: [
  const Icon(Icons.person),
  Expanded(child: Text(longName, overflow: TextOverflow.ellipsis)),
])

// Content taller than the screen, especially with the keyboard open
SingleChildScrollView(child: Column(children: fields))

// Chips or tags that should flow onto the next line
Wrap(spacing: 8, runSpacing: 4, children: tags)

// A Column inside a Column needs bounded height
Expanded(child: ListView(children: items))

// See which box is at fault
// flutter run, then press "p" for the layout guides, or
debugPaintSizeEnabled = true;   // in main(), from rendering/debug.dart

How to diagnose Dart errors

Dart errors are dominated by null safety at runtime and version solving at build time. The null-check operator failure (! on a null) is Dart's equivalent of a NullPointerException and almost always means an assumption about initialisation order was wrong. Pub version solving failures are dependency-graph conflicts and are solved by reading the constraint that pub reports as unsatisfiable, not by deleting the lockfile.

If the quick fix above does not resolve it, work through these steps. They apply to this whole class of error, not just to this one message, which is usually what saves the time.

Read the full pub get output. It names the two packages whose constraints conflict. Deleting pubspec.lock hides that information without fixing anything.
Replace ! with a null check plus a meaningful error, or with late final where initialisation genuinely happens before first use. The crash location is where the assumption broke.
Run flutter doctor -v before debugging any build failure. It catches missing Android SDK components and licence acceptance, which produce misleading Gradle errors.
Use dart pub deps --style=tree to see the resolved graph and find which transitive dependency is pinning an old version.
Clear derived state with flutter clean only after you have read the error. It resets the symptom and loses the evidence.

Tools worth reaching for

flutter doctor -v
dart pub deps
dart analyze
flutter run --verbose

Authoritative references

Primary documentation for this error, worth reading before applying any fix in production.

docs.flutter.dev

Related Dart errors

See all 10 Dart errors →

Browse other categories

Something missing or wrong?

This entry is maintained by hand. If the fix is out of date, incomplete, or you have a better one, email a correction and it will be reviewed.