title: How to split two containers in 60% / 40% and position text at the bottom of a container in Flutter?
body: <p>I am trying to create something similar like the image below, where there are two containers, one that takes 40% of the screen and the other one the rest of the screen.</p>
  
  <p>In the top container I would like to have a text at the top and one at the bottom, left aligned.</p>
  
  <p>I have this:</p>
  
  <pre><code> // main page body
   body: Container(
      child: Column(
        children: [
  
          // top container
          new Expanded(
            child: null, // todo, add the two texts,
          ),
  
          // bottom container
          new Container(
            height: 400.0,  // this needs to be 60% of the page
            child: new Text('test'),
          ),
        ],
      ),
    ),
  </code></pre>
  
  <p><a href="https://i.stack.imgur.com/fOtXo.jpg" rel="noreferrer"><img src="https://i.stack.imgur.com/fOtXo.jpg" alt="enter image description here"></a></p>