title: Bootstrap 4 - using Flexbox with responsive columns
body: <p>I am trying to make a row with buttons positioned at the beginning of the row and at the end. Here are two images. First when the Browser is maximized:
  <a href="https://i.stack.imgur.com/SlqaV.png" rel="noreferrer"><img src="https://i.stack.imgur.com/SlqaV.png" alt="enter image description here"></a></p>
  
  <p>The second is after I resized the Browser:</p>
  
  <p><a href="https://i.stack.imgur.com/iDfyi.png" rel="noreferrer"><img src="https://i.stack.imgur.com/iDfyi.png" alt="enter image description here"></a></p>
  
  <p>For that I am implementing the following code:</p>
  
  <pre><code>&lt;div class="d-flex justify-content-end"&gt;
     &lt;div class="mr-auto p-2"&gt;Flex item 1&lt;/div&gt;
     &lt;div class="p-2"&gt;Flex item 2&lt;/div&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p><a href="https://jsfiddle.net/1cv8f4bb/" rel="noreferrer">Fiddle</a></p>
  
  <p>Just to learn how to use Flexbox with B4. The code does position items correctly, but when I resize it the columns dont stack up.</p>
  
  <p>Any idea how to make it fully responsive?</p>
  
  <p>Thanks for the help.</p>