title: How to solve “A RenderFlex overflowed on the right.” error in Row?
body: <p>I get the error on the Row widget.
  How can I fix it?</p>
  <p><a href="https://i.stack.imgur.com/UzUxJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/UzUxJ.png" alt="enter image description here" /></a></p>
  <pre><code>Column(
      children: [
        Padding(
          padding: const EdgeInsets.all(20.0),
          child: Row( // error is shown on this line
            children: [
              const Image(
                height: 120,
                width: 120,
                image: NetworkImage(...),
              ),
              Padding(
                padding: const EdgeInsets.all(8.0),
                child: Wrap(
                  spacing: 5.0,
                  runSpacing: 5.0,
                  direction: Axis.vertical,
                  children: [
                    Text('Message:'),
                    Text('Hello world! How are you doing?'),
                  ],
                ),
              )
            ],
          ),
        ),
      ],
  ),
  </code></pre>
  <blockquote>
  <p>A RenderFlex overflowed by 16 pixels on the right.</p>
  </blockquote>