将嵌套的无序列表彼此对齐

Question

我正在使用Foundation创建一个投资组合网站，我正在运行一个问题。我有一个简历部分，其UL包含3个嵌套的UL。我希望resume__column具有33％的宽度并且彼此相邻排列。 33％的宽度部分正在工作，但我无法弄清楚如何将它们彼此相邻对齐。 （我使用基金会）

我的HTML：

<div class="resume__content">
 <ul>
<li class="resume__column">
  <ul>
    <li><h5>Lorem ipsum</h5></li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
  </ul>
</li>
<li class="resume__column">
  <ul>
    <li><h5>Lorem ipsum</h5></li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
  </ul>
</li>
<li class="resume__column">
  <ul>
    <li><h5>Lorem ipsum</h5></li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
    <li>Lorem</li>
  </ul>
</li>

我的SCSS：

.resume {
  &__content {
    @include grid-column(12, $center: true);
    ul {
      margin: 0;
      padding: 0;
      list-style: none;
      display: inline;
    }
    li {
      padding: 0;
    }
  }
  &__column {
    display: inline;
    width: 33%;
    float: left;
    ul {
      margin: 0;
      padding: 0;
      list-style: none;
    }
    li {
      padding: 0;
    }
  }
}