title: How to force flex columns to stay on the same line if container 'flex-wrap' is set to 'wrap'
body: <p>I'm trying to create the layout with one row and two columns inside one flex container. Here is the code <a href="http://jsfiddle.net/73574emn/1/" rel="noreferrer">http://jsfiddle.net/73574emn/1/</a> .</p>
  
  <p>What I want is to make the row always stay above columns and both columns to stay on the same line. Obviously, now if I make the window too small then column3 will move down under the column2 because <code>flex-wrap</code> property is set to <code>wrap</code> (because I need row and columns to be on separate lines).</p>
  
  <p>I suppose that I can wrap row in one flex container and both columns in another, <strong>but</strong> I want to know if there are any ways to do it while they are in the same container, and if yes then how it works. Maybe I can do something with width or min-width?  </p>
  
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-css lang-css prettyprint-override"><code>*
  {
      box-sizing: border-box;
  }
  
  .flex
  {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
  }
  
  .row {
    background-color: green;
    flex: 0 1 100%;
  }
  
  .column1 {
    background-color: red;
    flex: 1 0 50%;
    text-align: center;
    padding: 10px;
  }
  
  .column2 {
    background-color: yellow;
    flex: 1 0 50%;
    text-align: center;
    padding: 10px;
  }</code></pre>
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;div class="flex"&gt;
      &lt;div class='row'&gt;Hithis is a long test sentence this is a long test sentence this is a long test sentence this is a long test sentence &lt;/div&gt;
      &lt;div class='column1'&gt;Hellothis is a long test sentence this is a long test sentence this is a long test sentence this is a long test sentence &lt;/div&gt;
      &lt;div class='column2'&gt;Hello 2this is a long test sentence this is a long test sentence this is a long test sentence this is a long test sentence &lt;/div&gt;
  &lt;/div&gt;</code></pre>
  </div>
  </div>
  </p>