title: How to apply flexbox styling to radio buttons?
body: <p>I have a flexbox row with boxes that looks like this.</p>
  
  <p><a href="https://i.stack.imgur.com/tkURN.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/tkURN.png" alt="enter image description here"></a></p>
  
  <p>And I want to style radio buttons like this, so that they can be checked. 
  Is this possible to do?</p>
  
  <pre><code>&lt;ul class="flex-container longhand"&gt;
    &lt;li class="flex-item"&gt;1&lt;/li&gt;
    &lt;li class="flex-item"&gt;2&lt;/li&gt;
    &lt;li class="flex-item"&gt;3&lt;/li&gt;
    &lt;li class="flex-item"&gt;4&lt;/li&gt;
    &lt;li class="flex-item"&gt;5&lt;/li&gt;
  &lt;/ul&gt;
  </code></pre>
  
  <p><strong>CSS</strong></p>
  
  <pre><code>.flex-container {
    padding: 0;
    margin: 0;
    list-style: none;
    display: flex;
  }
  
  .longhand {
    flex-flow: wrap row;
  }
  
  .flex-item {
    color: #C3D0D9;
    border: 1px solid #C3D0D9;
    width: 50px;
    height: 50px;
    font-size: 1.3em;
    text-align: center;
    padding: 10px;
  }
  </code></pre>