Safari Flexbox отключает контент

Question

У меня есть 3 строки, заголовок , содержимое и нижний колонтитул . Он отображает, как и ожидалось, в Chrome, но отсекает дно в Safari. Что я делаю не так?

Скриншот

.wrapper {
  display: flex;
  flex-flow: column;
  height: 100%;
}

.content {
  flex: 1;
}

<div className="wrapper">
  <div className="header">I am a header</div>
  <div className="content">I am some content</div>
  <div className="footer">
    <ul>
      <li>Hi</li>
      <li>Hi</li>
      <li>Hi</li>
      <li>Hi</li>
      <li>Hi</li>
    </ul>
  </div>
</div>