Break A Ul In Columns (edited For Clarity)

I have the following code on my page for my first class.

http://codepen.io/memoblue/pen/XKGXAN

Here you go:

.tab-content1 {
  display: flex;
  flex-wrap: wrap;
  > div:not(.tab-content1-block1) {
    flex-basis: 33.3333%;
  }
}

.tab-content1-block1 {
    flex-basis: 100%;
  > ul {
    display: flex;
    flex-wrap: wrap;
    > li {
      flex-basis: 33.3333%;
    }
  }
}

Note: it's using SCSS and I didn't add the browser prefixes to keep it easier to read… Let me know if anything's unclear.

Share