title: How to get Containers to fill available vertical space in a Row?
body: <p>can anyone help me out?</p>
  
  <p>I'm struggling to figure out how I can get the coloured containers to extend to match the height of the tallest one in their row.</p>
  
  <p>Currently they have no fixed height/width and are wrapped in Expanded widgets to get their dynamic size.</p>
  
  <p>I'd like to keep their responsive sizes if possible. I already have a method in place to switch to a Column instead of a Row once the screen is small enough. Once in a Column I can use <code>width: double.infinity</code> because there is no horizontal scroll..</p>
  
  <p><a href="https://i.stack.imgur.com/asxfJ.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/asxfJ.png" alt="Row with Containers"></a></p>
  
  <p>This is an example of the code used (sorry there's so much!):</p>
  
  <pre><code>class HomePage extends StatelessWidget {
    @override
    Widget build(BuildContext context) {
      return Scaffold(
        body: Scrollbar(
          child: CustomScrollView(
            slivers: &lt;Widget&gt;[
              SliverNavBar(),
              SliverList(
                delegate: SliverChildListDelegate(
                  [
                    Row(
                      crossAxisAlignment: CrossAxisAlignment.start,
                        children: _homePageContent(),
                       );
                    Footer()
                  ],
                ),
              ),
            ],
          ),
        ),
      );
    }
  }
  </code></pre>
  
  <pre><code>_homePageContent() {
    return &lt;Widget&gt;[
      _HomePageInfoBox(
        backgroundColor: accentColor,
        title: 'THIS IS A TITLE',
        body:
            'Lorem ipsum...',
      ),
      _HomePageInfoBox(
        backgroundColor: primaryColorDark,
        title: 'THIS IS A TITLE',
        body:
            'Lorem ipsum....',
      ),
      _HomePageInfoBox(
        backgroundColor: primaryColor,
        title: 'THIS IS A TITLE',
        body:
            'Lorem ipsum...',
      ),
    ];
  }
  </code></pre>
  
  <pre><code>class _HomePageInfoBox extends StatelessWidget {
    const _HomePageInfoBox({
      Key key,
      @required this.title,
      @required this.body,
      @required this.backgroundColor,
    }) : super(key: key);
  
    final String title;
    final String body;
    final Color backgroundColor;
  
    @override
    Widget build(BuildContext context) {
      return Expanded(
        Container(
        color: backgroundColor,
        child: Padding(
          padding: const EdgeInsets.all(50),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.start,
            children: &lt;Widget&gt;[
              Text(
                title,
                style: TextStyle(
                    color: primaryTextColor,
                    fontSize: 25,
                    fontFamily: 'CoffeeAndTea'),
              ),
              SizedBox(height: 10),
              Text(
                body,
                style: TextStyle(
                    color: primaryTextColor,
                    fontSize: 24,
                    height: 1.4,
                    fontFamily: 'ElegantSans'),
              ),
              SizedBox(height: 20),
              Text(
                "Let's Go!",
                style: TextStyle(
                    color: Colors.white, fontFamily: 'CreamCake', fontSize: 30),
                textAlign: TextAlign.center,
              ),
            ],
          ),
         ),
       ),
      );
    }
  }
  </code></pre>