title: Flexbox with Unordered list
body: <p>I'm trying to learn flexbox and I really like it. I'm trying το play with dynamic widths and when I do it with <code>div</code>s it works. If I try to do it with <code>li</code>, it doesn't work as well. My code is up on <a href="http://codepen.io/jrock2004/pen/pjvZJd" rel="noreferrer">codepen</a>.</p>
  <pre><code>div.example
    ul
      li
        | 1
      li
        | 2
      li
        | 3
      li
        | 4
      li
        | 5
      li
        | 6
  
  div.container
    div.col
      | 1
    div.col
      | 2
    div.col
      | 3
    div.col
      | 4
    div.col
      | 5
    div.col
      | 6
  </code></pre>
  <p>SASS Code</p>
  <pre><code>.container {
    border: 1px solid #000;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 50%;
    
    .col {
      width: calc(100% / 3);
      height: 120px;
      text-align: center;
    }
  }
  
  .example {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    width: 50%;
    border: 1px solid #000;
    margin: 1em 0;
    
    ul {
      width: 100%;
      padding-left: 0;
    }
  
    li {
      list-style: none;
      display: inline-block;
      width: calc(100% / 3);
      height: 120px;
      text-align: center;
    }
  }
  </code></pre>